Introdução

Introdução >

Introdução

 Return to chapter overview

Criamos este guia online para que aqueles que quiserem começar imediatamente a usar o WebSite X5 para criar seus próprios websites, blogs e lojas virtuais, possam começar já, tendo toda a ajuda que precisarem a seu alcance.

Cada passo da criação do projeto é acompanhado por uma descrição clara da interface do Programa em que estiver trabalhando, com uma explicação detalhada de todos os comandos e opções disponíveis nos vários menus, painéis e janelas.

Com as explicações e informações fornecidas neste guia, a sequência lógica e fácil de acompanhar do Programa, e a ajuda adicional de pré-visualizações do seu trabalho, sempre atualizadas em tempo real, você não terá problema algum em usar o WebSite X5 para criar websites atraentes, interessantes e profissionais.

Este guia do WebSite X5 se refere a Evolution versão v. 10 mas pode ser usada com outras versões do Programa, mantendo em mente as diferenças funcionais específicas entre as diversas versões.

O guia é organizado em três partes:

- | O ambiente de trabalho Esta seção descreve todas as funções fornecidas pelo software, nas janelas que se abrem quando você está criando e publicando seu website.
- | Melhores Práticas Esta seção contém tutoriais que simulam todas as etapas envolvidas na execução de tarefas específicas, como estipular senhas para as Áreas Reservadas e criar formulários para envio de dados.
- | Maiores informações Esta seção contém maiores informações sobre diversos tópicos relacionados à criação de website.

Última atualização: versão 10


WebSite X5: O que ele faz

WebSite X5 da Incomedia: O que ele faz

Introdução >

WebSite X5 da Incomedia: O que ele faz

 Return to chapter overview

O WebSite X5 da Incomedia permite que você crie websites, lojas virtuais, blogs, álbuns de fotos digitais ou apresentações interativas de forma rápida e fácil. Os projetos são desenvolvidos em uma estrutura semelhante à internet e são organizados menus com vários níveis: não há limite para o número de páginas que você pode adicionar.

Cada página pode ter um layout diferente, que você pode completar com muitos tipos diferentes de objetos: texto, imagens, tabelas, galerias, vídeos, som, formulários de email, redes sociais, um livro de visitas, mapas, animações em Flash™, listas de produtos, objetos HTML e widgets.

O WebSite X5 oferece inúmeros recursos interessantes para editar imagens, o que significa que você não precisará de nenhum outro programa gráfico. Imagens são automaticamente compactadas quando salvas, de modo que você não terá nem mesmo que se preocupar em otimizar suas fotos antes de incluir em uma página.

Agora você pode criar um website completo e profissional com ferramentas fáceis de usar: uma enorme quantidade de modelos gráficos, um editor para criar botões em 3D, uma abundância de possibilidades para personalização gráfica, a adição de uma página de introdução, oferecer opções de idioma para a exibição do seu website, Áreas reservadas com senha de acesso, blogs, RSS feeds e lojas online com a comodidade do cartão de crédito, só para listar algumas.

E, quando estiver pronto, o WebSite X5 tem um mecanismo interno de FTP (File Transfer Protocol) para publicar seu site na Internet de e assim não será preciso usar de nenhum programa externo de FTP.

Trabalhando com o WebSite X5

O WebSite X5 age como um assistente, o que significa que ele se comporta como um guia visual que conduz você por cada etapa da criação de um website completo, funcional e atraente, do qual você se orgulhará!

Há apenas 5 passos entre sua idéia de um website perfeito e vê-lo publicado e disponível na Internet:

1. Configurações Gerais

Uma vez que tenha decidido como quer o seu projeto, e adicionado as informações gerais sobre o site, como uma descrição e palavras-chave para a indexação pelos mecanismos de busca, o WebSite X5 ajudará você a definir a aparência do seu site. Você pode selecionar entre os mais de 1.500 modelos padronizados ou, se preferir, criar seu próprio modelo desde o início. Você pode usar o editor interno para personalizar tanto o cabeçalho (header) quanto o rodapé (footer) para que fique do jeito que preferir.

2. Planejamento do Site

A partir da Página Inicial, com o WebSite X5 você pode começar a definir a estrutura hierárquica do seu website. Você pode incluir quantos níveis e sub-níveis precisar, com um número ilimitado de páginas. Seu menu de navegação será criado automaticamente, usando seu Mapa do site como base. Você pode alterar seu Mapa a qualquer momento, se desejar fazer alterações ou atualizar o website.

3. Criação das Páginas

Você pode criar páginas e trabalhar no seu layout simplesmente arrastando e soltando os objetos que estão disponíveis: texto, tabelas, imagens, animação, vídeo e áudio, galerias de fotos, formulários para envio de dados e emails, redes sociais, seu livro de visitas, o Mapa do site, a lista de produtos, código HTML e Widget. Você pode personalizar objetos importados e finalizá-los com links tanto para objetos internos quanto externos. Com o editor de imagens próprio, você pode girar, corrigir ou aplicar filtros, máscaras e molduras às imagens que tiver importado, sem ter que usar nenhum software adicional.

4. Configurações Avançadas

Uma vez que tenha personalizado seu website, você pode então prosseguir para a definição do estilo dos diversos elementos que aparecerão no seu website, tais como menu de navegação, os diversos elementos de texto, a janela Showbox e seus emails. O editor interno permite que você crie botões 3D, os quais podem ter um efeito especial quando sob o cursor do mouse. Você pode completar seu website com recursos como uma página de Introdução, que pode ter uma música de fundo associada a ela, e opções de idioma nos quais o site poderá ser lido, e você também pode criar Áreas Restritas a membros, com login e senha de acesso, incluir banners publicitários, RSS feeds, um blog e até mesmo uma loja virtual online.

5. Exportar

O WebSite X5 ajudará você em todo o processo de publicação na Internet do website já finalizado: você pode dar início a uma sessão de FTP, onde todos os arquivos necessários para dar visibilidade ao seu website na Internet são transferidos para um servidor. O WebSite X5 suporta sessões seguras e economiza seu tempo com conexões simultâneas e publicação inteligente somente dos arquivos que tiverem sido alterados.

Além de publicar seu website na Internet, você também poderá exportar seu projeto para outro disco no seu computador, ou criar uma cópia de segurança de todo o seu projeto.


Versões Disponíveis

Introdução >

Versões Disponíveis

 Return to chapter overview

O WebSite X5 está disponível em várias versões, sendo as principais: Evolution e Compact.

Para saber mais sobre as diferenças entre as diversas versões, visite http://www.websitex5.com/compare


Apresentando o WebSite X5

O ambiente de trabalho >

Apresentando o WebSite X5

 Return to chapter overview

Crie websites, lojas online e blogs em 5 passos

O WebSite X5 é o software ideal para criar os websites que você sempre quis. Você não precisa saber nada sobre programação! Este software oferece uma interface intuitiva e completamente visual para você trabalhar, e você pode checar seu trabalho à medida em que progride, com as prévisualizações que são atualizadas cada vez em que você dá uma olhada.

O WebSite X5 guia você a cada passo da criação do seu website até sua publicação na Internet. Ele é extremamente fácil de usar, é flexível e oferece uma grande margem para personalizar do seu jeito.

O WebSite X5 automaticamente gera o código de página em HTML5 + CSS 2.1 ou 3 para as escolhas que você fizer e as configurações que você definir em cada página, garantindo total compatibilidade com todos os navegadores e dispositivos móveis, bem como uma indexação precisa nos mecanismos de busca.

Ferramentas web profissionais

O WebSite X5 é tão fácil de usar que você não terá problema algum em incorporar ferramentas profissionais sofisticadas no seu website, tais como:

§Lojas virtuais com pagamento por cartão de crédito

§Blog com podcast e videocast

§Mecanismo interno de busca

§Formulários de email com filtros anti-spam

§Notícias e RSS feed

§Fotos panorâmicas e em zoom

§Galerias de fotos e de vídeo

§Gerenciamento de acesso

§Gerenciamento de anúncios em banners

§Websites com vários idiomas

Uma solução multifuncional

O que é melhor, com o WebSite X5 você economizará tempo e energia porque ele já inclui tudo o que você precisa para criar um website completo:

§Editor de modelos

§Editor de imagens

§Gerador de Menu

§Mecanismo de FTP interno

§1.500 modelos personalizáveis

§6.000 fotos livres de royalty

§Bibliotecas de botões

§Coleção de Widgets

Esta mistura de simplicidade e sofisticação (em termos de quantidade e qualidade de recursos incluídos) é a chave do sucesso do WebSite X5: ele é simplesmente o software certo para todos que desejam ter um website!


O ambiente de trabalho

O ambiente de trabalho >

O ambiente de trabalho

 Return to chapter overview
Exibir/Ocultar o texto oculto

Como já dissemos, o WebSite X5 atua como um assistente, o que significa que quando você trabalha com ele, você é levado por cada etapa como em uma visita com guia: a cada etapa do procedimento, uma janela se abre onde você pode inserir ou adicionar as informações necessárias para criar, atualizar e publicar um website completo, profissional e atraente.

Todas as janelas exibidas pelo programa têm a mesma interface gráfica: todas têm as mesmas barras de botões superior, lateral e inferior e uma área de trabalho na janela central que modifica de acordo com a parte do projeto em que estiver trabalhando e o tipo de informação que precisa ser incluída.

Clique para expandir/recolher
A janela de trabalho
Clique para expandir/recolher Barra de botões superior

A barra de botões superior inclui os comandos que você precisa ter disponíves o tempo todo, independente da parte do projeto em que estiver trabalhando. Estes comandos são principalmente para abrir a ajuda online e obter informações sobre o estado do Programa, salvar o projeto e para fazer uma cópia de segurança (backup) dele, e para abrir uma previsualização do seu trabalho no navegador próprio do Programa.

§Ajuda: este comando abre a ajuda online. Use a seta esquerda do botão Ajuda para ver os outros comandos:

-Índice...: abre a ajuda online.

-Vídeo Tutorial: abre uma página na web com uma lista de tutoriais em vídeo que explicam como começar a trabalhar com o WebSite X5.

-WebSite X5 Gallery: abre o WebSite X5 Answers na seção que contém os websites criados com o WebSite X5 e que foram enviados diretamente por seus autores.

-Modelos do WebSite X5: abre a seção no WebSite X5 Answers que é dedicada aos modelos. Ela contém novos modelos que foram criados pela Incomedia e por outros autores, e eles podem ser exibidos e baixados. Alguns deles são grátis!

-Suporte técnico: abre o WebSite X5 Answers, o website que fornece assistência técnica para o WebSite X5. No WebSite X5 Answers você pode pesquisar nos FAQs e nos tutoriais, ou pode enviar um pedido de ajuda.

-www.websitex5.com: abre o website do WebSite X5.

-Sobre o WebSite X5: exibe informações gerais sobre a versão do WebSite X5 instalada no seu computador.

§Salvar [CTRL + S]: salva o projeto atual. O projeto é salvo automaticamente na Pasta de Projetos como especificado na janela Preferências. Você pode usar a seta à esquerda do botão Salvar para ver estes comandos:

-Salvar a cada Pré-visualização: salva o projeto automaticamente cada vez que você usar o comando Pré-visualizar para exibir uma prévia do seu website.

-Criar um Backup ao salvar o Projeto pela primeira vez: cria automaticamente uma cópia de sergurança (backup) do seu projeto (arquivo Backup.iwprj) depois que você salvar pela primeira vez na sessão de trabalho atual.

-Criar backup a cada vez que publicar: cria automaticamente uma cópia de segurança (backup) do seu projeto (arquivo Uploaded_timestamp.iwprj) antes de você publicá-lo na Internet.

As cópias de backup criadas pelas funções Criar um Backup ao salvar o Projeto pela primeira vez e Criar backup a cada vez que publicar são gravadas na sub-pasta Backup que você especificou na janela Preferências e podem ser encontradas em Pasta de Projetos.

Se você quiser criar uma cópia de segurança (backup) do seu projeto, em vez de usar um comando Salvar como, você pode usar o Duplicar na janela Seleção do projeto.

-Pré-visualizar: exibe uma prévia local do seu website até o momento, usando o navegador interno do programa.

Sej você deixar a opção Atualizar as páginas durante modificação do Projeto ativa na janela Preferências, cada vez que você fizer uma alteração (e clicar em OK ou no botão Avançar para salvar) o Programa recria e atualiza tudo aquilo que estiver vinculado à alteração feita. Isto significa que a prévisualização do website é atualizada constantemente, e será exibida corretamente imediatamente se você quiser vê-la.

Você também pode selecionar a opção Salvar a cada Pré-visualização para que o projeto seja salvo cada vez que você clicar no botão Pré-visualizar.
Clique para expandir/recolher Barra de botões lateral

O WebSite X5 conduz você por todo o trabalho de criação de um website em apenas 5 passos. Os botões no lado esquerdo da janela do Programa, que ficam sempre disponíveis, indicam em qual passo você está trabalhando atualmente e você pode usá-los para se mover entre os passos (você não tem que seguir a ordem em que eles aparecem).

 | Seleção do projeto
1. | Configurações Gerais
2. | Planejamento do Site
3. | Criação das Páginas
4. | Configurações Avançadas
5. | Exportar
Clique para expandir/recolher Barra de botões da parte inferior

A barra de botões da parte inferior tem os botões que você precisa para se mover pelo Programa:

§Voltar: leva você de volta à janela anterior, caso queria realizar mais alterações lá.

§Avançar: leva você para a janela seguinte, para continuar a criar seu website.


Bem-vindo ao WebSite X5 da Incomedia

O ambiente de trabalho >

Bem-vindo ao WebSite X5 da Incomedia

 Return to chapter overview

A página de Introdução é a primeira janela que você vê quando inicializa o WebSite X5. Ela inclui vários links para recursos e materiais online que podem ajudar você a trabalhar no Programa. Estes links ficam disponíveis em uma barra de botões laterais que tem o seguinte aspecto:

Vídeo Tutorial: abre uma página na web com uma lista de tutoriais em vídeo que explicam como começar a trabalhar com o WebSite X5.

WebSite X5 Galery: abre o WebSite X5 Answers na seção que contém os websites criados com o WebSite X5 e que foram enviados diretamente por seus autores.

WebSite X5 Modelos: abre a seção no WebSite X5 Answers que é dedicada aos modelos. Ela contém novos modelos que foram criados pela Incomedia e por outros autores, e eles podem ser exibidos e baixados. Alguns deles são grátis!

WebSite X5 Answers: abre o WebSite X5 Answers, o website que fornece assistência técnica para o WebSite X5. No WebSite X5 Answers você pode pesquisar nos FAQs e nos tutoriais, ou pode enviar um pedido de ajuda.

Verificar atualizações: verifica se há atualizações disponíveis online para a versão do WebSite X5 em que você está trabalhando. Recomendamos que você sempre verifique se há novas atualizações e as instale o quanto antes, para garantir que terá sempre o melhor do seu software.

Preferências: abre a janela Preferências, onde você pode definir algumas configurações gerais sobre como você quer que seu Programa trabalhe.

Além desta barra de botões lateral, a página de Introdução também inclui informações que são atualizadas em tempo real quando você está conectado à Internet. Estas informações se referem às versões mais recentes disponíveis online da sua cópia od Programa, notícias, conteúdo especial (que podem ser artigos, documentação, dicas & truques), novos tutoriais em vídeo e os descontos mais recentes e ofertas especiais.

Se o computador não estiver conectado à Internet, a página de Introdução exibe uma página padronizada. Esta página será exibida mesmo se a opção Verificar atualizações ao iniciar o programa. na janela Preferências não tiver sido selecionada.

Quando você tiver terminado de examinar o conteúdo da página de Introdução, você pode começar a criar seu website clicando no botão Iniciar.


A janela Preferências

O ambiente de trabalho >

A janela Preferências

Return to chapter overview
Exibir/Ocultar o texto oculto

Esta janela se abre quando você clica no botão Preferências na página de Introdução, e aqui você poderá fazer algumas configurações gerais sobre como o Programa deverá trabalhar.

Clique para expandir/recolher Referência: O comando na janela Preferências

As opções na seção Geral são:

§Pasta de Projetos: esta é a pasta onde o seu arquivo de projeto (Projeto.IWPRJ) é salvo, quer você esteja criando um novo projeto ou importando um anterior (veja em Seleção do projeto | Importar...). Porque a pasta já está indicada, quando você clica no botão Salvar quando está trabalhando no seu website, seu projeto será salvo nesta pasta sem que ele fique pedindo para você indicar onde salvar.

§Verificar atualizações ao iniciar o programa.: esta opção significa que as novas atualizações do software serão buscadas sempre que o Programa for inicializado. O programa inicia uma conexão com a Internet no servidor do Incomedia procurando por atualizações lá.

Aconselhamos deixar esta opção marcada, para que você tenha certeza de sempre estar trabalhando com a versão mais recente disponível do WebSite X5.

As opções para Criação dos arquivos são:

§Manter a Pré-visualização atualizada ao trabalhar no projeto: garante que a pré-visualização do website será constantemente atualizada com todos os incrementos no seu projeto. Isto basicamente significa que cada vez que você adicionar algo novo ou fizer alguma alteração, e clicar em um botão OK ou Avançar), o Programa automaticamente atualiza a pré-visualização do website que você pode ver a nível local no seu PC usando nosso navegador interno.

§Atualizar as páginas durante modificação do Projeto: sincroniza as páginas que você criar no seu website enquanto você segue trabalhando no seu projeto. Então, cada vez que você confirmar uma adição ou fizer uma alteração (clicando em um botão OK ou Avançar), o Programa recria todas as partes nas outras páginas do projeto que serão afetadas pela nova parte. Este recurso mantém a pré-visualização do website atualizada e se você clicar em Pré-visualizar para verificar seu progresso, você verá todas as adições/alterações imediatamente.

§Número máximo de processamentos simultâneos: significa que você pode definir a quantidade de processos (ou "Threads") que o programa inicializa, e que serão executados simultaneamente pelo computador.

O que é Multithreading?

É uma técnica pela qual um processo é dividido em vários processos menores, que são executados ao mesmo tempo. Obviamente, seu computador tem que ter a capacidade de lidar com isso. O recurso Multithreading maximiza o poder de cálculo do computador, fazendo com que ele trabalhe em várias threads ao mesmo tempo. Graças a esta técnica, programas como o WebSite X5, que tenham sido desenvolvidos para distribuir a carga de trabalho entre diversas threads diferentes, podem obter um desempenho notavelmente melhor.

Você precisa avaliar corretamente a capacidade de hardware do seu computador para aproveitar ao máximo o Multithreading. Tente começar com 5 processos simultâneos e aumentar este valor gradualmente até que não note mais nenhuma melhora significativa no seu desempenho.

Finalmente, as opções Configurações de servidor web para a visualização local tratam da exibição correta das pré-visualizações do website:

§Porta: é a porta que o WebSite X5 instrui o servidor local de rede para observar de modo que as pré-visualizações do website sejam exibidas corretamente.

§Endereço de IP: é o endereço de IP que o WebSite X5 instrui seu servidor local de rede para observar de modo que as pré-visualizações do seu website apareçam como você espera. O valor padrão para a opção de endereço de IP é 127.0.0.1, que sempre identifica o computador local (o seu). A maioria das pessoas não precisa alterar este valor.

Nós aconselhamos não alterar os valores que já estiverem definidos para as opções Porta e Endereço de IP, a menos que você tenha certeza absoluta do que está fazendo.

Melhores práticas:

-

Como organizar as cópias de segurança (backup) do seu projeto


Passo 0 - Seleção do Projeto

Seleção do Projeto

Passo 0 - Seleção do Projeto >

Seleção do Projeto

 Return to chapter overview
Exibir/Ocultar o texto oculto

Depois de iniciar o WebSite X5 e ter visto a página de Introdução, você pode ir para a janela Seleção do projeto, onde você terá que indicar em qual projeto deseja trabalhar.

Você pode escolher se quer criar um novo projeto ou se deseja trabalhar em um que já tenha sido criado.

Clique para expandir/recolher Referência: Comandos na janela Seleção do projeto

§Criar um novo Projeto: escolha esta opção se quiser começar a trabalhar em um novo projeto. Primeiro, você precisa dar um nome ao novo projeto: digite um nome no campo abaixo dessa opção. Você pode salvar o projeto clicando no botão Salvar, que está sempre presente na barra de botões superior.

Não é preciso especificar um caminho (local) quando salvar um projeto porque o programa cuida disso salvando todos os seus projetos em Pasta de Projetos como foi definido na janela Preferências.

§Editar um Projeto existente: esta opção permite que você abra um projeto já existente, para que possa adicionar novo conteúdo a ele ou realizar alterações necessárias. Todos os nomes de projetos já existentes são exibidos em uma lista. Há algumas opções disponíves para selecionar e abrir o projeto no qual deseja trabalhar, e elas são:

Exibir Ícones Grandes - Exibir Nomes - Exibir Lista - Exibir detalhes

Estas opções definem como as pré-visualizações do projeto serão exibidas.

Exibir Grupos pela última data de edição

Esta opção agrupa e exibe os projetos de acordo com sua última data de edição.

Use os comandos a seguir para organizar seus projetos:

§Importar...: este comando importa um projeto que tenha sido criado e exportado (veja Exportar o Projeto) com o WebSite X5 em um outro computador.

§Renomear: use este comando para alterar o nome do projeto selecionado. Você também pode clicar duas vezes no nome de um projeto para alterá-lo.

§Duplicar: faz uma cópia de projeto selecionado.

§Apagar: apaga o projeto selecionado.

Melhores práticas:

-

Como organizar as cópias backup do projeto


Configurações Gerais

Passo 1 - Configurações Gerais >

Configurações Gerais

 Return to chapter overview
Exibir/Ocultar o texto oculto

Esta é a primeira janela do Passo 1. As informações que você inserir nos diversos campos desta janela estabelecerão os parâmetros básicos para o projeto em que vai trabalhar.

Informações importantes como título do projeto, a URL (endereço do website), o idioma a ser usado e os códigos e meta tags que são necessários para ativar serviços extras como estatísticas do site, são inseridos nesta janela. Você pode optar entre inserir estas informações agora ou mais tarde.

As opções nesta janela são organizadas em duas abas: Básicas e Avançadas.

Clique para expandir/recolher Referência: Opções na aba Básicas

§Nome do site: insira o título que você deseja dar ao seu website neste campo. O título será exibido na barra de títulos do navegador quando seu website estiver publicado na Internet. É obviamente um parâmetro importante porque ele permite que visitantes e mecanismos de busca identifiquem seu website corretamente.

O valor padrão neste campo é o nome que você deu ao seu projeto (veja em Seleção do projeto) e você pode alterá-lo a qualquer momento: você pode escolher um nome melhor, ou pode querer alterá-lo para tentar melhorar a otimização.

§Autor do site: insira o nome da pessoa, empresa, clube, etc, que deverá aparecer como sendo o autor do website. O nome do autor aparece na meta tag <author> por todas as páginas do site no código HTML, e é o equivalente eletrônico a assinar um trabalho realizado.

§Endereço do site (URL): insira o endereço URL (por exemplo http://www.meusite.com.br) onde o website estará localizado quando for publicado na Internet. Esta informação é essencial para os RSS feeds, o carrinho de compras da loja virtual e para o SiteMap funcionarem corretamente (este último é criado automaticamente pelo Programa e é vinculado às páginas do website).

§Descrição do site: insira uma breve descrição do website neste campo. Procure elaborar uma descrição resumida e direta ao ponto, porque ela será adicionada à meta tag <description> no código HTML e será analisada pelos spiders dos mecanismos de busca para incluir seu website nos resultados das pesquisas.

§Palavras-chave: insira uma lista de palavras-chave (separadas por vírgula) que sejam relevantes para seu website. As palavras-chave serão adicionadas à meta tag <keywords> no código HTML e também serão usadas pelos mecanismos de busca para encontrar seu website.

A Descrição do site e a lista de Palavras-chave que você inserir nestes campos são automaticamente associadas com a Página Inicial do seu website.

Entretanto, você pode melhorar a otimização do website associando uma descrição e uma lista de palavras-chave a cada página (ou, pelo menos, as páginas mais importantes). Para fazer isso, vá para Criação do mapa, selecione a página em que irá trabalhar e clique em Propriedades.

§Idioma do conteúdo: insira o idioma que deseja usar no seu website neste campo. Todo o texto que for inserido automaticamente pelo Programa será exibido no idioma que você escolher aqui: links para âncoras embutidas, legendas para Objeto Formulário de Email, legendas e texto para o carrinho de compras da loja virtual, texto no Mapa do website.

Se você quiser alterar o texto que o Programa insere automaticamente, ou se quiser adicionar um novo idioma, clique no botão [image] e use as opções da janela Gerenciar conteúdos do idioma.

§Ícone do site: insira o nome do ícone (um arquivo .ICO, .PNG, .GIF ou .JPG) que será associado às páginas do website. Ese ícone será exibido à esquerda da URL na barra de endereços do navegador de Internet.

Os ícones associados a websites são frequentemente chamados de favicons (um composto de favorite icons). Você pode usar imagens nos formatos .ICO, .PNG, .GIF e .JPG. Arquivos no formato .ICO são importados como estão, enquanto que se focê usar arquivos de qualquer tamanho no formato .PNG, .GIF e .JPG, o WebSite X5 cria automaticamente uma cópia no formato .PNG no tamanho 16x16 pixels e usa esta cópia como favicon.
Clique para expandir/recolher Referência: Opções na aba Avançadas

§Código personalizado: indica onde o código personalizado será inserido no código HTML da página: Antes de fechar a tag HTML, Antes de fechar a tag HEAD, Propriedade da tag BODY (ex: style, onload, etc) (ou seja, como parte da tag <BODY>, por exemplo <BODY onload="alert('Olá!')">), Antes de fechar a tag BODY, Após fechar a tag BODY. Quando tiver decidido onde adicionar seu código personalizado, digite ou cole o trecho do código no campo correspondente.

Este campo pode ser usado, por exemplo, para ativar um serviço de estatísticas sobre acessos ao site tal como o Google Analytics™.

Para maiores informações sobre o Google Analytics™ e sobre como abrir uma conta lá, clique no botão [image] para acessar o site oficial: http://www.google.com/analytics/.

§Metatag de verificação para a Central do Webmaster do Google: insira a meta tag control para usar as ferramentas para Webmaster do Google Webmaster Central™.

Para maiores informações sobre as Central do Google para WebMaster™ e abrir uma conta lá, clique no botão [image] para ir ao site oficial: http://www.google.com/webmasters/.

§Criar SiteMap automaticamente: este está ativado por padrão, e o SiteMap será criado e vinculado automaticamente.

Para que o SiteMap seja criado corretamente, você deve inserir uma URL válida no campo Endereço do site (URL) na janela Configurações Gerais | Básicas.

§Ativar proteção do código HTML: habilita a proteção para as páginas publicadas do website, desativando cliques com o botão direito do mouse. O visitante não conseguirá ver o código das páginas online usando os comandos do menu de contexto que se abre quando o botão direito do mouse é clicado nas páginas.

Melhores práticas:

- | Como traduzir o texto que é inserido automaticamente
- | Como usar a Central Google para Webmasters™
- | Como assinar um serviço de estatísticas do tipo Google Analytics™

-

Como criar e vincular o SiteMap do seu website

Further information:

-

Navegadores web & o navegador do WebSite X5


A janela Gerenciar conteúdos do idioma

Passo 1 - Configurações Gerais > Configurações Gerais >

A janela Gerenciar conteúdos do idioma

 Return to chapter overview

Esta janela se abre quando você clica no botão [image] da opção Idioma do conteúdo na janela Configurações Gerais | Básicas. Você pode trabalhar no texto que o Programa insere automaticamente, tais como links para âncoras incorporadas, os botões da Objeto Galeria, as legendas do Objeto Formulário de Email, legendas e texto no carrinho de compras, texto no Mapa do website.

A janela Gerenciar conteúdos do idioma exibe a lista de idiomas disponíveis à esquerda e uma tabela com as traduções nos diversos idiomas à direita. A primeira coluna da tabela dá indicações da localização no Programa onde os diversos itens são usados. Então há uma coluna para cada idioma ativo (isto é, selecionados da lista de idiomas disponíveis). Você pode trabalhar diretamente nesta tabela para adicionar ou editar novos itens.

A janela Gerenciar conteúdos do idioma exibe os seguintes botões:

Acrescentar novo idioma: insira o nome de um novo idioma a ser adicionado na caixa de diálogo. Você deve user o formato "ID - NomeDoIdioma", por exemplo "EN - English".

Remover o idioma selecionado: este removerá o idioma selecionado da lista.

Importar um novo idioma: este importa um novo idioma, gravado como arquivo .XML, e o adiciona à lista de idiomas disponíveis.

Exportar o idioma selecionado: este exporta o idioma selecionado na lista para um arquivo .XML.

As opções Exportar o idioma selecionado e Importar um novo idioma são úteis quando você quiser salvar traduções em um idioma específico em um arquivo .XML e usar em outro computador.

Melhores práticas:

- | Como traduzir um texto automatico
- | Como criar um website em vários idiomas


Seleção do Modelo

Passo 1 - Configurações Gerais >

Seleção do Modelo

 Return to chapter overview
Exibir/Ocultar o texto oculto

Uma das chaves para um website de sucesso é uma aparência atraente. As primeiras impressões contam, e as opiniões dos novos visitantes do seu site serão influenciadas em grande parte pela apresentação gráfica, antes mesmo deles começarem a olhar o conteúdo. Um design bem planejado e de aparência profissional dá a impressão de um site de boa qualidade que vale a pena examinar.

WebSite X5 dá duas possibilidades para projetar seu website:

1. você pode criar um modelo personalizado, tanto começando do zero ou a partir de um dos modelos padronizados;

2. você pode usar um modelo padronizado, escolhendo um na galeria com mais de 1.500 modelos já incluídos no Programa.

Tanto os modelos padronizados quanto os personalizados podem ser modificados à vontade e ter adidionados a eles os muitos recursos oferecidos pelo editor interno mostrado na janela Personalização do modelo.

Todos os modelos padronizados são otimizados para serem exibidos a 1024 x 768 pixels. Se você quiser usar uma resolução diferente, use o Modelo personalizado.
Clique para expandir/recolher Referência: Comandos na janela Seleção do Modelo

A maior parte da janela Seleção do Modelo é dedicada à exibição dos modelos disponíveis. Você pode usar os seguintes comandos para filtrar os modelos em exibição, se isto tornar mais fácil seu processo de escolha do modelo que deseja usar:

Lista de Categorias

Esta opção exibe uma lista com as diversas categorias nas quais os modelos estão organizados, então você pode escolher quais quer que sejam exibidas. A primeira categoria contém todos os modelos personalizados que tenham sido criados do zero, e você só a verá se existir pelo menos um modelo personalizado. As categorias seguintes contém os diversos modelos padronizados que estão disponíveis.

Menu

Esta opção filtra os modelos padronizados de acordo com o tipo de menu que eles sugerem, de modo que você pode escolher exibir modelos com menu vertical, horizontal ou ambos.

Exibir Pré-visualização pequena - Exibir Pré-visualização média - Exibir Pré-visualização grande

Estas opções definem a forma como as miniaturas dos modelos serão exibidas.

Alterar a tonalidade do Modelo

Esta opção abre a janela Matiz do Modelo onde você pode alterar o tom da cor do modelo selecionado.

Os comandos a seguir estão disponíveis para se trabalhar nos modelos:

§Novo Modelo: inicia o processo de criação de um novo modelo personalizado desde o início. Estes modelos serão adicionados à categoria Personalizados.

§Renomear: use este comando se quiser renomear um modelo. Ele só pode ser usado nos modelos personalizados. Você não pode alterar o nome dos modelos padronizados. Você também pode renomear um modelo personalizado clicando duas vezes no nome dele.

§Duplicar: este comando faz uma cópia do modelo selecionado.

§Remover: este comando remove o modelo selecionado. Você só pode usá-lo nos modelos personalizados: os modelos padronizados não podem ser removidos.

§Editar...: este comando abre o modelo selecionado na janela Personalização do modelo para que você possa editá-lo. Ele só pode ser usado nos modelos personalizados. Se você quiser editar um modelo padronizado, primeiro você deverá fazer uma cópia dele clicando no botão Duplicar.

§Importar...: este comando importa um novo modelo (um arquivo .IWTPL) que tenha sido criado com o WebSite X5 e exportado.

§Exportar...: este comando exporta o modelo selecionado (um arquivo .IWTPL) para uma pasta específica. Ele poderá então ser compartilhado e usado em outros computadores.

Observações sobre compatibilidade com as versões anteriores:

§Menu Horizontal / Vertical - Em versões anteriores do programa (até a versão 8), a escolha entre menu vertical e horizontal era feita na janela Seleção do Menu, e na versão 9 havia uma opção específica Tipo de Menu. Na versão 10, basta selecionar o modelo padronizado que tem o tipo de menu que você quer. Se você criar um modelo personalizado, você terá que configurar o Tipo de menu com a opção relacionada.

§Cores - Na versão 8, cada modelo padronizado era disponibilizado em quatro opções de cores. Na versão 9, as opções de cores foram substituídas por estilos de cores, que ofereciam diferentes paletas de cores, configurações e imagens. Na versão 10 a distinção entre as variações de estilo foram eliminadas: agora cada modelo tem seu estilo e/ou configurações próprias, e cada um aparece na lista completa de modelos.

Melhores práticas:

- | Como trabalhar com os modelos
- | Onde encontrar novos modelos para o WebSite X5


A janela Matiz do Modelo

Seleção do Modelo | Matiz do Modelo

Passo 1 - Configurações Gerais > Seleção do Modelo >

Seleção do Modelo | Matiz do Modelo

 Return to chapter overview

Esta janela abre quando você pressiona o botão [image] na janela Seleção do Modelo. Você pode alterar a tonalidade do modelo personalizado ou padronizado em que estiver trabalhando.

Para configurar a tonalidade que deseja, basta deslizar o cursor do controle Matiz para a esquerda ou para a direita.

Graças a esta opção, praticamente não há limites para o número de variações gráficas de um modelo.

A variação da tonalidade se refere a todos os elementos do modelo, apesar dos seus efeitos não serem visíveis no preto, no branco e em tons de cinza.

Melhores práticas:

- | Como trabalhar com os modelos
- | Onde encontrar novos modelos para o WebSite X5


Modelo personalizado

Passo 1 - Configurações Gerais >

Modelo personalizado

 Return to chapter overview
Exibir/Ocultar o texto oculto

O WebSite X5 permite que você crie seu próprio modelo personalizado, começando do zero. Clique no botão Novo Modelo na janela Seleção do Modelo para criar uma miniatura de um novo modelo na categoria Personalizados: dê um duplo-clique na miniatura para abrir a janela Modelo personalizado, onde você poderá começar a criar seu modelo.

Para facilitar seu trabalho, a janela Modelo personalizado oferece um Pré-visualizar que mostra uma representação gráfica da página. Você pode escolher qual parte da página quer alterar a partir da lista, ou clique na pré-visualização para editá-la e ver as alterações aparecerem à medida em que for trabalhando.

Clique para expandir/recolher Referência: Opções de tipo de menu

Antes de começar a criar seu modelo personalizado, você precisa especificar o Tipo de menu, que definirá onde e como o menu de navegação será exibido em todas as páginas do website. As opções são:

Horizontal - Menu acima do cabeçalho

Horizontal - Menu sob o cabeçalho

Vertical - Menu à esquerda

Vertical - Menu à direita
Clique para expandir/recolher Referência: Opções das áreas da página

Quando você tiver escolhido o tipo de menu, você deverá seleiconar a Seção da página onde quer trabalhar. As páginas são divididas nas seguintes seções:

Fundo da página: é a área em torno da página. Ela fica visível quando a janela do navegador tem uma resolução maior do que a que foi configurada para o próprio website.

Fundo do Cabeçalho: é a parte do Fundo da página que fica atrás do Cabeçalho.

Cabeçalho: o cabeçalho (header) fica no alto da página. Normalmente ele contém principalmente elementos gráficos, e é o local ideal para colocar o título e o sub-título do website, um logo da empresa, campos de busca, menus de serviço com links para elementos como mapa do site e opções de idioma.

Menu: é onde o menu de navegação fixo aparece. Este menu exibe o primeiro nível de opções disponíveis, que aparecem exatamente do mesmo modo em todas as páginas do website. Esta seção fica ou no alto, embaixo, à esquerda ou à direita da página, dependendo do tipo de menu que você escolheu previamente.

Conteúdo da página: esta seção contém o conteúdo da página propriamente dito, e quaisquer sub-menus, se você os tiver.

Rodapé: esta seção fica no pé da página e, como o cabeçalho (header), é basicamente composto de elementos gráficos. Ele encerra visualmente a página. Ele geralmente é utilizado para colocar observações, isenções de responsabilidade, indicadores de direitos autorais (copyrights), cnpj, endereços de email, etc.

Fundo do Rodapé: é a parte do Fundo da página que fica atrás do Rodapé.

Se você configurar o Fundo do Cabeçalho ou o Fundo do Rodapé como Transparente, eles serão tratados como parte do Fundo da página e terão exatamente a mesma aparência. Se não forem Transparente então o Cabeçalho e/ou o Rodapé serão exibidos como faixas que cobrem toda a largura da janela do navegador.
Clique para expandir/recolher Referência: Propriedades gráficas das áreas da página

Você pode configurar as seguintes Propriedades Gráficas para as diversas áreas da página:

§Cor: indica a cor a ser usada como plano de fundo.

§Arquivo de imagem: indica o arquivo (.JPG, .GIF, .PNG.) da imagem a ser usada como plano de fundo. Você também pode ter uma animação em Flash (.SWF) no Cabeçalho ou no Rodapé.

§Repetir: indica se a imagem de fundo deverá ser repetida. Imagens podem ser repetidas horizontalmente, verticalmente ou em ambas direções para tomar todo o espaço disponível. Se você estiver trabalhando no Fundo da página a imagem pode ser redimensionada para cobrir o fundo por inteiro. Neste caso, as proporções originais podem não ser mantidas.

§Alinhamento: indica como a imagem deve ser alinhada na área específica da página.

A seguinte opção também está disponível para o Fundo da página:

§Imagem de fundo fixa: se você selecionar esta opção, a imagem de fundo da página fica fixa, mesmo quando o conteúdo da página é deslocado com as barras de rolagem.
Clique para expandir/recolher Referência: Tamanhos das áreas da página

Você pode configurar o Tamanho de algumas áreas da página.

A opção a seguir fica disponível para o Cabeçalho e o Menu:

§Largura: fornece a largura em pixels da área selecionada da página. O valor da Largura para os menus verticais por padrão é de 960 pixels para a área do Cabeçalho e 120 pixels para a área do Menu, e ambos os valores podem ser modificados. O valor da Largura para os menus horizontais é definido como o mesmo do Cabeçalho e também é usado para o Menu, Conteúdo da página e Rodapé.

O valor padrão da Largura é calculado para um website otimizado para ser exibido em uma resolução de 1024x768 pixels.

A seguinte opção fica disponível para as áreas, com excessão do Fundo da página e Conteúdo da página:

§Altura: dá a altura em pixels da área selecionada da página.

A seguinte opção só fica disponível para a área Conteúdo da página:

§Altura mínima: dá a altura mínima em pixels que a área com o conteúdo da página deve ter, independente da altura do conteúdo que for adicionado.

Clique para expandir/recolher Referência: Propriedades do conteúdo de área de página

Você pode definir as Propriedades do Conteúdo para algumas áreas da página.

A opção a seguir fica disponível para as áreas Fundo da página, Menu e Conteúdo da página:

§Margens: dá o valor em pixels para as margens (o espaço vazio entre a borda da área e seu conteúdo).

Esta opção fica disponível para as áreas Fundo da página e Menu :

§Alinhamento: para o Fundo da página, ela especifica como a página deve ser alinhada na janela do navegador. Para o Menu ela especifica como os botões do menu devem ser alinhados em relação à página.

A verdadeira largura das páginas do website é fornecida pela largura da área Conteúdo da página (que depende da largura do Cabeçalho), menos as margens esquerda e direita.

Você pode adicionar texto, fotos, animação em Flash, apresentações de slides, campos de busca e links no cabeçalho (header) do modelo. As opções são exibidas na janela Personalização do modelo, que você pode abrir clicando no botão Avançar.

Melhores práticas:

- | Como trabalhar com os modelos
- | Onde encontrar novos modelos para o WebSite X5


Personalização do modelo

Passo 1 - Configurações Gerais >

Personalização do modelo

 Return to chapter overview
Exibir/Ocultar o texto oculto

Depois de ter esolhido um dos modelos padronizados na janela Seleção do Modelo, ou de ter criado seu próprio modelo personalizado na janela Modelo personalizado, você prossegue para a janela Personalização do modelo. Você pode usar as opções na aba Cabeçalho e Rodapé desta janela para personalizar o cabeçalho e rodapé do seu modelo, adicionando texto, fotos, animação em Flash, apresentação de slides, código HTML, campos de busca e links.

Os comandos e opções para o Cabeçalho e o Rodapé são idênticos.

Se você usar uma animação em Flash como plano de fundo para o Cabeçalho ou o Rodapé você não poderá personalizá-los na janela Personalização do modelo.
Clique para expandir/recolher Referência: O editor de modelo

A janela Personalização do modelo contém um editor de imagens. Abaixo da barra de ferramentas, você pode ver a imagem de fundo do cabeçalho ou do rodapé do modelo que você escolheu (personalizado ou padronizado). A imagem é exibida na escala 1:1, e você pode deslocá-la se necessário. Quaisquer alterações que fizer com este editor serão exibidas em tempo real na imagem.

Há uma barra de status imediatamente abaixo da imagem que fornece as seguintes informações:

§Posição: são exibidas as coordenadas x e y do canto superior direito do objeto selecionado.

§Tamanho: informa a altura e a largura em pixels do objeto selecionado.
Clique para expandir/recolher Referência: Opções na barra de ferramentas

Você pode usar as opções na barra de ferramentas para adicionar novos objetos ao Cabeçalho / Rodapé do modelo e especificar algumas configurações para eles. Uma vez que um objeto tenha sido adicionado, você pode selecioná-lo e fazer alterações nele usando as opções que aparecem na caixa que tem o nome do objeto.

Cortar [CTRL+X] - Copiar [CTRL+C] - Colar [CTRL+V]

Para cortar, copiar ou colar o objeto selecionado.

Desfazer [CTRL+Z]

Para desfazer a última ação.

Trazer para a frente - Enviar para trás

Para trazer o objeto selecionado para o primeiro plano ou levar para segundo plano (para mostrar o objeto sobre ou sob qualquer objeto sobreposto a ele).

Associar um link a este objeto

Para criar um link no texto, imagem ou fotos selecionadas em uma apresentação de slides. Você pode definir o link na janela Link.

Posição e tamanho

Para abrir outra janela e especificar as coordenadas que posicionam e dimensionam o objeto selecionado. A opção Manter proporções (ativada por padrão) mantém as proporções originais do objeto se você redimensioná-lo.

Inserir texto - Inserir imagem - Inserir animação Flash - Inserir apresentação de slides - Inserir código HTML - Inserir campo de busca

Para adicionar texto, uma imagem, animação em Flash, uma apresentação de slides, código HTML ou um campo de busca.

Uma Apresentação de slides é uma série de imagens que são exibidas automaticamente uma após a outra. É um objeto útil para criar banners (especialmente para publicidade).

Você pode usar o código HTML para adicionar todo tipo de conteúdo, mesmo aqueles para os quais não há um objeto específico.

O campo de busca usa um mecanismo de busca interno para que os visitantes possam procurar por um conteúdo específico dentro do seu website.

Qualquer objeto animação Flash ou código HTML que você adicionar só ficará visível quando o website for aberto em um navegador.
Clique para expandir/recolher Referência: Opções para o objeto Cabeçalho / Rodapé

Clique nas imagens de fundo das abas Cabeçalho e Rodapé para selecioná-las e usar os seguintes comandos:

§Salvar como imagem JPG: quando estiver criando seu website, os objetos texto e imagem que adicionar ao Cabeçalho/Rodapé serão mesclados com a imagem de fundo, e serão automaticamente salvos como um novo arquivo no formato PNG. Este formato foi escolhido porque ele garante que as configurações de transparência que tiverem sido configuradas serão mantidas. Se você não tiver determinado nenhuma configuração de transparência, você pode selecionar a opção Salvar como imagem JPG para criar um arquivo de imagem de fundo menor.
Clique para expandir/recolher Referência: Opções para o objeto Texto

Você pode selecionar um objeto Texto no Cabeçalho / Rodapé e usar as seguintes opções para trabalhar com ele:

§Conteúdo: para inserir ou colar o conteúdo do texto neste campo.

§Fonte: para definir a fonte, estilo e tamanho do texto.

§Cor do texto / Cor do fundo: para definir a cor do texto e do fundo dele.

§Salvar como imagem PNG: se esta opção estiver ativa, o texto não será mesclado à imagem de fundo do Cabeçalho/Rodapé, em vez disso será salvo como uma imagem .PNG com fundo transparente. O texto original é automaticamente associado com a imagem .PNG como texto ALT(ernativo).
Clique para expandir/recolher Referência: Opções para o objeto Imagem

Você pode selecionar um objeto Imagem no Cabeçalho / Rodapé e usar as seguintes opções para trabalhar nele:

§Arquivo de imagem: para selecionar o arquivo que contém a imagem a ser inserida. Você pode inserir imagens em um dos seguintes formatos: .JPG, .GIF, .PNG, .BMP, .PSD, .TIF, .DIB, .PCX, .RLE, .TGA, .WMF.

§Arquivo de imagem sob foco: para selecionar outra imagem que será usada quando a seta do mouse passar sobre a primeira imagem. Esta opção é útil se quiser criar botões com efeito de clicado/liberado (sob cursor).

§Ativar transparência: para conferir transparência à imagem, de modo que a cor determinada não seja visível.

§Cor transparente: para especificar qual cor na imagem deverá ficar transparente se a opção Ativar transparência estiver selecionada. Você pode achar o "conta-gotas" útil para selecionar exatamente a cor que deseja diretamente da imagem.

§Tolerância: para especificar o fator de tolerância a ser aplicado à transparência. Quanto maior o fator de tolerância, maior será a área transparente na imagem.
Clique para expandir/recolher Referência: Opções para o objeto Animação Flash

Quando você selecionar um objeto Animação Flash que tiver adicionado à área do Cabeçalho / Rodapé, você poderá trabalhar com as seguintes opções:

§Arquivo de animação: selecione o arquivo .SWF que contém a animação em Flash que deseja adicionar.

§Fundo transparente: esta opção torna o fundo da animação transparente.
Clique para expandir/recolher Referência: Opções para o objeto Apresentação de slides

Quando selecionar um objeto Apresentação de slides que tenha sido adicionado à área do Cabeçalho / Rodapé, as seguintes opções ficam disponíveis:

§Nome do arquivo de imagem: lista as fotos da Apresentação de slides, e dá o nome do arquivo que contém cada foto. Ele também indica qualquer efeito e/ou link que possa ter sido associado a elas. Selecione um arquivo da lista para ver uma prévia da Apresentação de slides. Use CTRL + clique e SHIFT + clique para selecionar vários ao mesmo tempo.

§Adicionar... / Remover: Use estas opções para adicionar/remover fotos de/a uma Apresentação de slides. Você pode selecionar várias imagens de uma vez só a partir da Biblioteca de Imagens.

§Para cima / Para baixo: Use as setas para cima e para baixo para alterar a ordem na qual as fotos devem aparecer na Apresentação se slides. Selecione uma foto e pressione a seta para cima ou para baixo para movê-la para cima ou para baixo na lista de nomes de arquivos de imagens.

§Efeito...: esta opção abre a janela Propriedades do efeito, onde você pode definir os diversos efeitos de entrada, movimento e zoom para as fotos na Apresentação de slides.

§Início automático: esta opção faz com que a Apresentação de slides comece assim que o website for carregado no navegador.

§Visualização aleatória: se você selecionar esta opção, as fotos na apresentação de slides vão ser apresentadas em ordem aleatória, e não necessariamente na ordem em que aparecem na lista de nomes de arquivos de imagens.
Clique para expandir/recolher Referência: Opções para o objeto Código HTML

Selecione um Código HTML adicionado à área do Cabeçalho / Rodapé para usar os seguintes objetos:

§Código HTML: digite ou cole o código HTML do objeto que deseja criar. A barra de ferramentas oferece os seguintes comandos:

Cortar [CTRL+X] - Copiar [CTRL+C] - Colar [CTRL+V]

Estas opções cortam, copiam e colam o texto selecionado.

Desfazer [CTRL+Z] - Refazer [ALT+CAPS+BACKSPACE]

Estes comandos desfazem/refazem a última operação a ser feita/desfeita.

Inserir Widgets

Esta opção insere o código do widget selecionado: clique na seta ao lado do botão para exibir a lista completa de widgets, como eles aparecem em Objeto HTML e Widgets. Clique no widget que deseja abrir na janela Widget, onde você poderá configurar os parâmetros necessários. Quando confirmar, o código HTML para o widget será redigido e adicionado automaticamente no editor.

§Exibir barras de rolagem: esta opção exibe as barras de rolagem.

Observações sobre compatibilidade com as versões anteriores:

Na versão anterior 9, este editor Código HTML permitia que você adicionasse snippets (algumas linhas de código) automaticamente. Na versão atual 10, o recurso de snippets foi aperfeiçoado e eles foram adicionados à lista de widgets.
Clique para expandir/recolher Referência: Opções para o objeto Campo de busca

Quando você seleciona o objeto Campo de busca na área do Cabeçalho / Rodapé você pode trabalhar com as seguintes opções:

§Texto do botão: você pode escrever o texto a ser exibido no botão que inicia a busca.

§Fonte: selecione a fonte, estilo e tamanho do texto no botão de busca.

§Cores dos campos: você pode escolher a cor do texto e do plano de fundo do campo de busca.

§Cores dos botões: você pode escolher a cor do texto e do plano de fundo do botão de busca.

§Quando você adiciona um Campo de busca ao Cabeçalho / Rodapé do modelo, uma Página Especial é automaticamente adicionada ao Mapa com o nome "Busca": você pode selecioná-la e abrir a janela Propriedades da Página para especificar suas propriedades.

§O resultado de uma busca dentro do website é exibido em páginas criadas automaticamente pelo Programa: a aparência destas páginas depende das configurações que você definir na seção Estilos e Modelos do Passo 4 - Configurações Avançadas).

Clique para expandir/recolher Referência: Opções para Efeitos

Quando você seleciona um objeto Texto, Imagem ou Apresentação de slides no Cabeçalho / Rodapé você pode definir diversos efeitos especiais para esse objeto. Os efeitos disponíveis são listados ao lado do Tipo de efeito.

Você pode selecionar mais de um efeito para cada objeto Texto, Imagem e Apresentação de slides. Você precisa definir as configurações para cada efeito:

Efeito

Configurações

Sombra

§Difusão: indica o tamanho que a sombra deve ter.

§Cor: define a cor da sombra.

§Distância X / Distância Y: define a posição horizontal da sombra em relação ao objeto. Um valor positivo desloca a sombra para baixo e para a direita. Um valor negativo desloca a sombra para cima e para a esquerda.

Reflexo

§Difusão: indica o tamanho que o reflexo do objeto deve ter.

§Distância: indica a distância do objeto em que o reflexo deve ser posicionado.

Borda colorida

§Espessura: define a espessura da borda do objeto em pixels.

§Cor: define a cor da borda.

Brilho externo

§Difusão: especifica a concentração do brilho externo.

§Cor: define a cor do brilho externo.

Chanfrado

§Profundidade: define o grau de acentuação do chanfrado.

§Difusão: especifica a concentração do chanfrado.

§Ângulo: define o ângulo do chanfrado.

Rotação

§Ângulo: especifica quantos graus o objeto deverá ser girado (sentido horário).

Opacidade

§Opacidade: determina um valor de 0 a 255. A transparência do objeto aumenta com valores mais baixos.

Suavizar

§Difusão: especifica a concentração do suavizado.

Onda

§Difusão: determina a amplitude da onda.

§Frequência: determina a proximidade que as ondas devem ter entre si.

Perspectiva

§Horizontal: determina o ponto de fuga para uma perspectiva horizontal à direita (com valores positivos) ou à esquerda (com valores negativos).

§Vertical: determina o ponto de fuga para uma perspectiva vertical para baixo (com valores positivos) ou para cima (com valores negativos).

Distorcer

§Horizontal: determina a inclinação, dando valores positivos para manter a base do objeto fixa, e valores negativos para manter o topo do objeto fixo.

§Vertical: dê valores positivos para puxar o objeto para baixo no lado esquerdo e valores negativos para puxar para baixo à direita.

Melhores práticas:

- | Como trabalhar com modelos
- | Onde encontrar novos modelos para o WebSite X5

Maiores informações:

-

Como o mecanismo de busca funciona no WebSite X5


Criação do mapa

Passo 2 - Criação do mapa >

Criação do mapa

 Return to chapter overview
Exibir/Ocultar o texto oculto

Um website é uma coleção estruturada de páginas. É importante ter uma estratégia clara ao planejar esta estrutura de modo que as páginas do seu website sejam conectadas logicamente umas às outras e que os visitantes possam navegar pelo seu website com facilidade.

Um site bem estruturado significa que o visitante não ficará perdido quando navegar por ele, e sempre saberá onde está: ele deve ser capaz de encontrar a informação que procura fácil e rapidamente. Um site mal estruturado confunde e frustra o visitante e, no pior dos casos, leva o visitante a abandonar o site de vez.

A janela Criação do mapa é onde você planeja a estrutura do seu website. Você pode adicionar todas as páginas e organizá-las em vários níveis. Uma vez que tenha definido a estrutura do Mapa com os títulos das páginas, você pode proseguir para adicionar o conteúdo às páginas. Clique repetidamente no botão Avançar para abrir as páginas na mesma ordem em que foram adicionadas ao Mapa. Se preferir, você pode usar o Mapa para abrir a janela do programa onde poderá trabalhar diretamente em uma determinada página: dê um duplo-clique na página no Mapa ou selecione-a e clique em Avançar.

Clique para expandir/recolher Referência: O Mapa do site

A maior parte da janela Criação do mapa é tomada pela árvore do Mapa do site, que é uma representação esquemática do Mapa do site que você está criando.

Um mapa básico é exibido por padrão. Ele tem uma pasta Menu que contém a Página Inicial e mais 3 outras páginas. Você pode usar os comandos disponíveis para adicionar níveis, páginas e separadores para criar o Mapa para o website que deseja.

Se você usar as diversas seções do Passo 4 - Configurações Avançadas para adicionar um mecanismode busca interno (veja em Personalização do modelo), uma Página de introdução, um Blog, uma Área Reservada (basta configurar uma página como Página Protegida) ou um Carrinho de Compras, uma pasta denominada Páginas Especiais será adicionada ao seu Mapa, e ela incluirá os seguintes itens: Busca, Página de Introdução, Login e Carrinho de Compras.

Além de exibir a árvore estrutural do Mapa, outras informações úteis são fornecidas para as páginas que você adicionar, como o Título completo da Página e a Descrição da Página. Estas informações são retiradas das definições fornecidas na janela Propriedades da Página, que você já terá preenchido anteriormente.
Clique para expandir/recolher Referência: Comandos na barra de ferramentas

A barra de ferramentas acima do Mapa oferece os seguintes comandos:

Cortar [CTRL+X] - Copiar [CTRL+C] - Colar [CTRL+V]

Estes comandos cortam, copiam e colam as páginas selecionadas no projeto atual ou em outros projetos. Estes comandos também ficam disponíveis no menu popup que se abre se você clicar no botão direito do mouse sobre o Mapa.

Expandir - Recolher

Estes comandos expandem e recolhem o nível selecionado para exibir/ocultar as páginas nele.

Página oculta

Selecione este comando se quiser que a página ou nível atual fique oculto no Mapa. Se um nível ficar oculto, então todas as páginas dentro dele também ficarão ocultas. Uma página oculta pode ser útil como uma forma de fornecer informação adicional em um tópico específico, e ela poderá ser exibida criando-se um link para ela no ponto em que for necessário. Lembre-se de criar pelo menos um link para uma página oculta, ou então ela não ficará acessível.

Página protegida

Este comando abre a janela Página protegida, onde você pode proteger uma página clicando na opção Configurar esta Página como Protegida. Então você deverá especificar quais grupos e/ou usuários individuais poderão ter acesso à Página protegida, clicando nos seus nomes na lista que é exibida. Permitir acesso de um grupo não é a mesma coisa que permitir acesso de todos os usuários em um grupo: se novos usuários forem adicionados a um grupo, eles só poderão acessar as Páginas protegidas se o grupo tiver acesso.

Clique para expandir/recolher
Página protegida

Para criar novos grupos/usuários, vá para a janela Gerenciamento do acesso no Passo 4 - Configurações Avançadas.

§Você pode ocultar a página inicial no mapa, mas isso só deverá ser feito se você providenciar um link para ela em outros locais do website, por exemplo, no cabeçalho.

§Se você criar seu próprio menu de navegação, você pode ocultar todas as páginas e níveis no Mapa: em vez de selecionar uma página por vez, você pode selecionar a pasta do menu e clicar no botão Página oculta.

Clique para expandir/recolher Referência: Comandos para formatar o Mapa do site

Os comandos para formatar o Mapa do site são:

§Novo Nível [CTRL+L]: para adicionar um novo nível ao menu. Não há limite para a quantidade de níveis que você pode adicionar.

§Nova Página [CTRL+P]: para criar uma nova página, que será adicionada automaticamente ao nível selecionado.

§Separador: para incluir um separador, que ajudará a diferenciar entre os diversos itens no menu. Um separador pode ser um espaço ou uma legenda, e é particularmente útil em menus com várias colunas (veja em Estilo do Menu Suspenso | Itens de Menu no Passo 4 - Configurações Avançadas).

§Remover [DEL]: para remover a página, nível ou separador selecionado.

§Renomear [F2]: para modificar o nome da página inicial, da página, nível ou do separador. Níveis, páginas e separadores devem ser nomeados corretamente quando forem adicionados, pois os itens do menu são incluídos automaticamente no menu de navegação usando os títulos dados para as páginas individuais, e eles também são usados como nomes para os arquivos em HTML que correspondem a cada página, a menos que seja determinado de outra forma na janela Propriedades da Página.

§Para cima [CTRL+U] / Para baixo [CTRL+D]: para alterar a ordem das páginas, níveis e separadores, movendo o item selecionado para cima ou para baixo.

Você também pode alterar a ordem dos niveis, páginas e separadores diretamente no Mapa: selecione o item que deseja mover, arraste-o para a posição almejada e solte-o lá. Você pode selecionar vários itens de uma vez usando as teclas CTRL e SHIFT.

§Propriedades: para configurar as propriedades da página selecionada (na janela Propriedades da Página), ou do nível (na janela Propriedades do Nível).

Melhores práticas:

-

Como criar e trabalhar no Mapa do site


A janela Propriedades do Nível

Passo 2 - Criação do mapa > Criação do mapa >

A janela Propriedades do Nível

 Return to chapter overview
Exibir/Ocultar o texto oculto

A janela Propriedades do Nível se abre quando você seleciona um nível no Mapa do site. Clique no botão Propriedades para ver as opções disponíveis para definir as propriedades dos diversos níveis do Mapa do site.

No WebSite X5 os níveis do Mapa não contêm conteúdo, ao contrário das páginas: eles são categorias que são usadas para organizar as páginas em grupos lógicos e fornecer indicações claras para os visitantes se localizarem dentro do seu website.

Clique para expandir/recolher Referência: Propriedades do Nível

§Ocultar Menu DropDown para este nível: se você selecionar esta opção, o menu dropdown (lista suspensa) para este item de menu não será exibido quando o cursor do mouse passar sobre o nome do nível.

§Link a ser executado ao clicar no item: se você selecionar esta opção, o Link se abre e você pode criar um link diretamente para o item de nível.

Pode ser útil "ocultar Menu dropdown para este nível" e definir um "link a ser executado ao clicar no item" quando, por exemplo, você quiser criar um link para um site externo como item de menu, ou se quiser substituir um sub-menu que contenha muitos itens por uma página criada especialmente para dar acesso às diversas áreas.

§Ícone para o item de Menu: você pode selecionar um arquivo de imagem (no formato .JPG, .GIF ou .PNG) que será exibido como ícone do nível no menu.


A janela Propriedades da Página

Passo 2 - Criação do mapa > Criação do mapa >

A janela Propriedades da Página

 Return to chapter overview
Exibir/Ocultar o texto oculto

A janela Propriedades da Página se abre quando você seleciona uma página no Mapa do site. Clique em Propriedades para ver todas as opções disponiveis para definir as propriedades necessárias para a otimização, personalização gráfica e adição de código às páginas do seu website.

As opções de propriedade de páginas são organizadas em 3 abas: Geral, Cores e Avançadas.

Clique para expandir/recolher Referência: Opções na aba Geral

Use as opções nesta aba para definir uma série de valores que são necessários para uma otimização correta da página:

§Título completo da Página: dá à página um nome que difere do que consta no Mapa do site.

O nome dado à página no Mapa do site é mantido no menu de navegação. O Título completo da Página dado aqui é exibido como título da página quando ela for exibida online.

Se você estiver trabalhando na Página Inicial, o título não é exibido na página, apesar de você poder definir um Título completo da Página: o título original é usado no menu, e na meta tag <title> no código HTML da página, mas você pode especificar um Título completo da Página que será usado na meta tag <title>.

§Descrição da Página: você pode inserir uma descrição para a página. Ela deve ser curta e direta ao ponto: será usada como valor para a meta tag <description> no código HTML da página e usado pelos mecanismos de busca para indexar seu website.

§Palavras-chave: você pode inserir palavras-chave específicas para esta página (devem ser separadas por vírgula). As palavras-chave serão usadas como valores para a meta tag <keywords> no código HTML da página e usadas pelos mecanismos de busca para indexar seu website.

§Nome do arquivo: você pode especificar um nome para o arquivo HTML desta página.

A menos que determinado de outra forma, o nome padrão para o arquivo HTML é o nome dado à página no Mapa do site. Use nomes curtos e significativos de modo que o endereço seja simples e fácil de lembrar. Isto também ajuda a melhorar a indexação pelos mecanismos de busca. Esta opção não está disponível para a Página inicial.
Clique para expandir/recolher Referência: Opções na aba Cores

As opções nesta aba são usadas para definir alguns aspectos gráficos importantes da página em que estiver trabalhando.

Em primeiro lugar, você pode dar um plano de fundo para a página, diferente do usado para as outras páginas do website, e que foi definido no modelo selecionado (veja Seleção do Modelo). Lembre-se que o plano de fundo da página é a área em volta da página quando a janela do navegador é aberta com uma resolução maior do que a do seu website.

As opções para o Fundo do Site somente para esta Página são:

§Cor do fundo: indica a cor a ser usada como plano de fundo.

§Arquivo de imagem: indica o arquivo (.JPG, .GIF, .PNG.) da imagem a ser usada como plano de fundo.

§Repetir: indica se a imagem do plano de fundo da página deverá ser repetida ou não. Ela pode ser repetido horizontal, verticalmente ou em ambas direções (ladrilho) para ocupar todo o espaço disponível. A imagem do plano de fundo também pode ser redimensionada para se ajustar ao espaço disponível.

§Alinhamento: você pode indicar como a imagem do plano de fundo da página deverá ser alinhada.

§Imagem de fundo fixa: se você selecionar esta opção, a imagem de fundo da página fica fixa, mesmo quando o conteúdo da página é deslocado com as barras de rolagem.

O plano de fundo do conteúdo da página selecionada também poderá ser diferente do das outras páginas do website, definido no modelo (veja Seleção do Modelo). Neste caso, você terá que usar as opções do Conteúdo de página somente para esta Página, que são idênticas às opções para o plano de fundo da página.

Finalmente, você pode definir algumas Opções gerais:

§Icone para o item de Menu: selecione o arquivo de imagem (no formato .JPG, .GIF ou .PNG) para o ícone que aparece no menu de navegação, ao lado do título da página.

§Criar a Página sem o Modelo: se você selecionar esta opção, os parâmetros para o modelo (padronizado ou personalizado - veja Seleção do Modelo) não serão aplicados a esta página: será uma página com conteúdo mas sem a parte gráfica nem o menu de navegação.

§Largura da Página: esta opção só fica disponível se você tiver selecionado a opção Criar a Página sem o Modelo: ela especifica a largura da página em pixels.
Clique para expandir/recolher Referência: Opções na aba Avançadas

Use as opções nesta aba para editar manualmente o código HTML para a página em que estiver trabalhando.

§Extensão do arquivo: indica o formato no qual o arquivo da página será salvo. A extensão padrão é o .HTML, mas você pode escolher entre .PHP, .ASP, .CFM e .JSP. O arquivo index.html da Página Inicial também pode ser salvo em um formato diferente. Você não pode alterar o formato dos arquivos das páginas protegidas (veja [image] Página protegida na barra de ferramentas do Mapa do site): deve continuar sendo .PHP.

§Código personalizado: indica onde o código personalizado será inserido no código HTML da página: Antes de fechar a tag HTML, Antes de fechar a tag HEAD, Propriedade da tag BODY (ex: style, onload, etc) (ou seja, como parte da tag <BODY>, por exemplo <BODY onload="alert('Olá!')">), Antes de fechar a tag BODY, Após fechar a tag BODY. Quando tiver decidido onde adicionar seu código personalizado, digite ou cole o trecho do código no campo correspondente.

A opção Código personalizado é útil quando, por exemplo, você quiser vincular uma página de estilo (CSS) específica à página, ou quando eventos específicos tiverem que acontecer no carregamento da página. Para alguns JavaScripts funcionarem corretamente, você precisa adicionar linhas de código personalizadas tanto na seção <HEAD> quanto <BODY> do arquivo HTML da página. JavaScripts podem ser adicionados usando o Objeto HTML e Widgets.

Finalmente, a aba Configurações do SiteMap inclui opções para se trabalhar no SiteMap:

§Inserir esta página no SiteMap: fica selecionado por padrão, e adiciona a página ao SiteMap.

§Prioridade do conteúdo: dá um nível de prioridade à página, indicando sua importância no website, em relação às outras páginas. Este parâmetro será incluído no SiteMap.

§Frequência de atualização: especifica a frequência com que a página será atualizada. Este parâmetro será incluído no SiteMap.

Observações sobre compatibilidade com as versões anteriores:

Ao contrário das versões anteriores, na versão 10 é possível abrir a janela Propriedades da Página para as páginas especiais que aparecem automaticamente no Mapa do site quando o mecanismo de busca interno é usado no website (veja Personalização do modelo), e quando uma Página de introdução, um Blog, uma Área restrita ou um Carrinho de compras são adicionados.

Maiores informações:

-

Os Navegadores e o navegador próprio doWebSite X5


Criação da página

Passo 3 - Criação da página >

Criação da página

 Return to chapter overview
Exibir/Ocultar o texto oculto

Uma vez que tenha definido o Mapa do seu projeto, você pode começar a criar as diversas páginas que vão compor seu website. A janela Criação da página é onde você pode criar suas páginas e adicionar conteúdo a elas.

O caminho e o título da página em que você estiver trabalhando são indicados como Página atual.

Clique para expandir/recolher Referência: A tabela de layout da página

WebSite X5 usa uma tabela para tornar o layout de página mais fácil de trabalhar. A tabela básica tem 2 linhas por duas colunas (num total de 4 células): para criar sua página (adicionar conteúdo a ela), tudo o que você tem que fazer é arrastar um objeto da lista dos que estão disponíveis e soltá-lo em uma célula. Cada célula só pode conter um único objeto.

Se você quiser, poderá adicionar mais linhas e colunas à tabela básica, aumentando assim o número de células disponíveis para colocar conteúdo. Você também pode alterar a largura de cada coluna. Conforme veremos, poder modificar a diagramação da tabela da página e inserir objetos de modo que eles ocupem mais do que uma célula, confere uma grande liberdade de ação para criar layouts de página complexos e profissionais.

Observação: a tabela de layout de página não fica visível quando seu website for publicado na Internet. O único propósito da tabela é ajudar você a diagramar o conteúdo da sua página para obter o melhor efeito. A tabela de layout de página não se traduz em uma tabela de verdade no código HTML da página (com excessão de alguns pouquíssimos casos de combinações complexas de layout de página).

Conforme mencionado acima, uma célula na tabela de layout de página pode conter somente um único objeto, porém um objeto pode ocupar células adjacentes tanto horizontal quanto verticalmente, e pode até ocupar um espaço maior do que o espaço físico da página.

O modo em que as células são exibidas na tabela de layout de página muda de acordo com seu status:

§Se a célula contiver um objeto que ainda não foi preenchido, o ícone do objeto é exibido na célula sobre um fundo cinza com linhas diagonais;

§Se a célula contiver um objeto que já foi preenchido, o ícone do objeto é exibido na célula sobre um fundo azul;

§Se a célula contiver o objeto selecionado, serão exibidos uma borda e controles de seleção.

Clique para expandir/recolher Referência: Os comandos da barra de ferramentas

A barra de ferrramentas fica imediatamente acima da tabela de layout de página, e contém os seguintes comandos:

Editar

Este comando abre uma janela onde você pode criar o objeto que foi selecionado na tabela de layout de página. A janela que se abre dependerá do tipo de objeto selecionado (texto, imagem, animação flash, etc.).

Estilo da célula

Este comando abre a janela Estilo da célula onde você poderá definir a aparência da célula atual.

Inserir Âncora

Este comando cria uma âncora e a associa com o objeto selecionado na tabela de layout de página. Se você clicar na seta ao lado do botão, verá um menu com as seguintes opções: Inserir Âncora..., Editar... e Remover.

Adicionar uma linha/Adicionar uma coluna

Você pode adicionar uma nova linha ou coluna à tabela de layout de página. Clique na seta ao lado do botão para indicar se a linha/coluna deverá ser adicionada antes ou depois da célula selecionada. O tamanho máximo da tabela de layout de página é de 64 linhas x 12 colunas.

Remover linha / Remover coluna

Estes comandos removem a linha/coluna selecionada da tabela de layout de página. O tamanho mínimo para uma tabela de layout de página é de 1 linha x 1 coluna (uma célula).

Uma âncora é uma referência que ajuda a identificar a posição de um objeto dentro de uma página: é usado para criar links direcionados diretamente a um objeto.

Observações sobre compatibilidade com as versões anteriores:

Nas versões anteriores, as opções para margens de células e alinhamento do conteúdo da célula eram localizadas nos menus exibidos pelos botões [image] e [image] na barra de ferramentas acima da tabela de layout de página. Na versão 10, estes botões foram removidos, e as opções agora estão na janela Estilo da célula| Estilo .
Clique para expandir/recolher Referência: A lista de objetos disponíveis

A lista de objetos disponíveis fica ao lado da tabela de layout de página. Para inserir um objeto em uma página, selecione seu ícone na lista e arraste & solte na célula apropriada dentro da tabela de layout de página.

Os objetos disponíveis são:

Objeto Texto | Objeto Imagem | Objeto Tabela | Objeto Galeria
Objeto Vídeo/Som | Objeto Formulário de Email | Objeto Rede Social | Objeto Livro de Visitas
Objeto Mapa | Objeto Animação Flash | Objeto Lista de Produtos | Objeto HTML e Widgets

Uma vez que tenha inserido um objeto na tabela de layout de página, clique no botão [image] (ou dê um duplo-clique no objeto) para abrir a janela que irá criá-lo de fato.

Observações sobre compatibilidade com as versões anteriores:

Objetos disponíveis - Os objetos Objeto Livro de Visitas, Objeto Rede Social e Objeto Mapa são novidades na versão 10 do WebSite X5: na versão anterior 9 eles ficavam disponíveis como widgets em Objeto HTML e Widgets.

Melhores práticas:

-

Como criar uma página usando a tabela de layout de página


Objeto Texto

Passo 3 - Criação da página >

Objeto Texto

 Return to chapter overview
Exibir/Ocultar o texto oculto

Texto é um elemento muito importante no conteúdo de um site. Assim como as imagens, vídeos e animações em Flash, uma boa parte do conteúdo de um site consiste de texto puro.

Redigir para a Internet não é a mesma coisa que regidir para um material que será impresso: a Internet tem características diferentes, tal como o suporte usado para exibir o texto (a tela do computador ou dispositivo móvel), como o texto será lido (ler em um computador está mais para uma passada de olhos rápida do que a leitura concentrada de um livro) e um número potencialmente ilimitado de alternativas (pense em quantos sites lidam com o mesmo assunto).

Para atrair a atenção de visitantes, seduzi-los a ler seu website e convencê-los que você tem um algo a mais para oferecer, o texto que você redigir deve se ajustar a uma publicação online. O que você escrever deve ser interessante e direto ao ponto. Divida o texto em frases curtas e parágrafos que sejam mais fáceis de ler e menos pesados de se olhar. Preste uma atenção especial à formatação que adotar: use negrito, itálico e sub-títulos, etc. com cuidado e coerência.

Os visitantes são mais atraidos por websites que tenham sido cuidadosamente planejados: nada tem mais chances de impedir que um visitante volte a um website, ou que continue a navegar por ele, do que um texto cheio de erros de ortografia, um layout feio, uma leitura complicada, e assim por diante.

Depois destas breves, mas importantes, considerações sobre Redigir para a Web, o WebSite X5 ajuda você a escrever seus textos usando um editor próprio e fornece os comandos de formatação de que precisa. Os textos criados em outros programas podem ser adicionados com simples operações de copiar e colar. Além disso, o WebSite X5 permite que você crie um texto que será exibido em abas: uma forma útil de organizar as informações em espaços pequenos como as páginas web.

Clique para expandir/recolher Referência: Os comandos do editor de texto

A barra de ferramentas do editor de texto contém estes comandos e opções:

Cortar [CTRL+X] - Copiar [CTRL+C] - Colar [CTRL+V]

Estes comandos cortam, copiam e colam o texto selecionado. O texto colado perderá todas as opções de formatação (negrito, itálico, etc) aplicadas no documento original, e receberá as opções equivalentes deste editor.

Colar especial

Use este comando se quiser colar um texto que tenha sido recortado ou copiado com o comando Cortar e Copiar , para o qual você queira manter a formatação original.

Você pode usar os comandos Cortar, Copiar e Colar para cortar, copiar e colar trechos de texto que tenham sido criados em outros editores.

Desfazer [CTRL+Z] - Refazer [ALT+CAPS+BACKSPACE]

Estes comandos desfazem/refazem a última operação a ser feita/desfeita.

Inserir link [CTRL+L]

Este comando insere um link na(s) palavra(s) selecionada(s). Você pode definir o link na janela Link que se abrirá.

Inserir imagem

Você pode adicionar uma imagem ao texto (no formato .JPG, .GIF, .PNG, ou .BMP). Imagens adicionadas a textos são automaticamente redimensionadas se forem maiores do que a célula na tabela de layout de página. Você também pode alterar o tamanho da imagem manualmente empurrando os controles de seleção. Por questões específicas do layout de página, você poderá preferir trabalhar em um objeto imagem na janela Objeto Imagem.

Habilitar código HTML

Com este comando você pode inserir código HTML diretamente ao texto da página. Quando trabalhar no modo HTML, os caracteres < e > não são interpretados como "menor que" e "maior que", em vez disso, qualquer coisa entre eles será interpretado como uma tag HTML.

Configurações de RollOver

Você pode aplicar um efeito de rollover ao texto, de modo que ele possa ser rolado. As configurações para o rollover são definidas na janela RollOver .

Ajustar conteúdo à largura da célula

Com esta opção, o editor irá simular a aparência do texto em relação ao tamanho da célula na tabela de layout de página que o contém.

Fundo claro/escuro

Esta opção estabelece uma cor escura ou clara para o plano de fundo do editor: isto pode ser útil se estiver trabalhando em um texto escrito em branco ou outra cor clara.

Tipo de Fonte - Tamanho da Fonte

Você pode escolher o tipo de letra (fonte) que irá usar no seu texto, e seu tamanho.

O menu de lista suspensa mostra todas as fontes que estão disponíveis no seu computador. Lembre-se que se você escolher uma fonte que não esteja disponível no computador do visitante, ela será automaticamente substituída por uma fonte que seja similar à configuração original.

Negrito [CTRL+B] - Itálico [CTRL+I] - Sublinhado [CTRL+U]

Essas opções aplicam negrito, itálico e sublinhado ao texto selecionado.

Cor da fonte - Cor do fundo

Você pode escolher uma cor para o texto selecionado, ou para seu plano de fundo.

Lista de marcadores

Você pode adicionar uma lista de marcadores.

Aumentar recuo / Diminuir recuo

Você pode aumentar ou diminuir o recuo do parágrafo selecionado.

Alinhar à esquerda - Centralizar - Alinhar à direita - Justificar

Você pode alinhar o texto selecionado à esquerda, à direita, centralizado ou justificado.

Texto à direita - Padrão - Texto à esquerda

Estas opções ficam ativas quando uma imagem é inserida no texto e for selecionada. Elas são usadas para definir como o texto será exibido ao redor da imagem: ele pode ficar totalmente à esquerda, totalmente à direita ou em torno da imagem.

Clique no botão direito do mouse para exibir um menu popup com os seguintes comandos: Desfazer, Cortar, Copiar, Colar, Colar especial e Selecionar tudo.


A janela RollOver

Passo 3 - Criação da página > Objeto Texto >

A janela RollOver

 Return to chapter overview
Exibir/Ocultar o texto oculto

Esta janela se abre quando você pressiona o botão [image] no editor Objeto Texto ou Objeto Tabela, e contém os comandos e opções para configurar os efeitos de deslocamento do texto.

Clique para expandir/recolher Referência: Configurações do Rollover

Em primeiro lugar você precisa selecionar Ativar RollOver, e então poderá configurar o deslocamento na aba Tipo:

§Movimento: Você pode escolher o estilo de deslocamento. Ele pode ser:

Nenhum - mostrar a barra de rolagem: O texto não se desloca, mas se a altura da célula em questão (veja a opção Altura), não for suficiente para exibir todo o texto, uma barra de rolagem será adicionada automaticamente.

Rolagem simples: o texto se desloca na direção indicada e para quando chega ao final do texto.

Rolagem contínua: o texto se desloca na direção indicada e, quando chega ao final do texto, reinicia o deslocamento a partir do início.

Rolagem alternada: o texto se desloca na direção indicada e, quando chega ao final do texto, ele reinicia o deslocamento na direção oposta.

Rolagem em blocos: o texto é dividido (virtualmente) em partes do tamanho determinado pela opção Altura. O deslocamento começa a partir da primeira parte, seguido por uma pausa, e então a segunda parte é deslocada. Isto continua até que a última parte tenha sido deslocada e exibida, e então a primeira parte reaparece. Este efeito funciona melhor quando um texto for redigido e formatado uniformemente de modo que possa ser dividido em partes iguais, e fornecendo um valor apropriado à opção Altura.

§Direção: Você pode especificar a direção do deslocamento: Em cima, Embaixo, Esquerda ou Direita.

A aba Opções contém as seguintes opções:

§Efeito: Você pode escolher entre Linear, Alternado e Vai-e-vem para todos os estilos de deslocamento, exceto Rolagem contínua.

§Altura: Você pode configurar a altura da célula que contém o texto.

§Velocidade (seg): Você pode especificar quantos segundos o efeito deverá durar. Se você configurar o estilo de deslocamento como Rolagem simples, Rolagem contínua ou Rolagem alternada, a duração é o tempo que leva para completar o efeito, antes de reiniciar. Se você tiver selecionado Rolagem em blocos, a duração é o tempo que leva exibindo uma parte do texto antes de passar para a próxima.

§Parar o movimento sob foco: O deslocamento irá parar quando o cursor do mouse passa sobre o texto.

A opção Altura só fica disponível se você tiver configurado um deslocamento vertical (para cima ou para baixo. Se você tiver configurado um deslocamento horizontal (para a esquerda ou para a direita), o efeito fica melhor se o objeto texto ocupar uma linha inteira na tabela de layout de página.


Objeto Imagem

Passo 3 - Criação da página >

Objeto Imagem

 Return to chapter overview
Exibir/Ocultar o texto oculto

Imagens e fotos estão entre os elementos usados com mais frequência em uma página na web. Eles ajudam a transmitir uma idéia, a anunciar um produto, a passar uma certa mensagem, ou simplesmente fazer uma página ficar mais atraente. Qualquer que seja o motivo, imagens são importantes porque elas ajudam a criar a impressão geral de um website e aumentar a percepção que ele é atraente, bem planejado e profissional.

WebSite X5 permite que você importe imagens nos principais formatos gráficos, e você pode usar o Editor de imagens para dar os toques finais às suas fotos: recortar, girar, corrigir, adicionar máscaras, filtros e molduras. Você também pode trabalhar nas fotos para dar a elas visualizações fantásticas em grande angular e em close.

WebSite X5 tem plena consciência do problema de cópias não-autorizadas de imagens na Internet. Um sistema de proteção interno evita que visitantes do site obtenham o arquivo original, e você ainda pode aplicar marcas d'água e de copyrights.

Os comandos para se criar um objeto imagem estão organizados nas abas: Geral, Exibição e Sitemap.

Clique para expandir/recolher Referência: Comandos na aba Geral

Use os comandos nesta aba para importar os arquivos gráficos e editar as imagens.

WebSite X5 lida com todos os principais formatos gráficos (.JPG, .GIF, .PNG, .PSD, .BMP, .TIF, .DIB, .PCX, .RLE, .TGA, .WMF): selecione a imagem que deseja importar a partir do seu computador, ou diretamente da Internet.

Uma pré-visualização da foto importada é exibida na caixa Pré-visualizar. Clique no botão Editar... logo abaixo da pré-visualização para abrir o Editor de imagens interno, onde você poderá editar a imagem.

Imagens podem ter várias Propriedades:

§Título: este é o título da imagem. Ele será adiconado ao atributo título da tag <img> no código HTML da página.

§Texto alternativo: este é o texto que é exibido quando a imagem não pode ser exibida por algum motivo. No código HTML da página, o texto alternativo será adicionado ao atributo alt da tag <img>.

Os parâmetros Título e Texto alternativo devem ser analisados cuidadosamente, porque eles são importantes para a acessibilidade e a otimização do website.

§Link: você pode adicionar um link à foto. Clique no botão [image] para abrir a janela Link, onde você pode definir o link e as opções.

Clique para expandir/recolher Referência: Comandos na aba Exibição

Use os comandos nesta aba para definir como a imagem importada será exibida: com o WebSite X5 você pode obter fotos grande angulares ou adicionar efeitos de close e de movimento.

As opções em Modo de exibição são:

Redimensionamento automático da imagem: esta opção fica ativa por padrão. O tamanho da imagem é adaptada automaticamente ao tamanho da célula na tabela de layout de página onde você a inseriu.

Mover e ampliar a imagem manualmente: com esta opção você pode ampliar a imagem clicando nela até que chegue ao tamanho indicado pelo fator de zoom. Você pode mover a imagem ampliada para trazer uma parte específica para o primeiro plano: clique na imagem e arraste-a para onde desejar.

Para obter este efeito, a imagem primeiro é encolhida para o tamanho da célula que ocupa na tabela de layout de página e depois é recalculado ou de acordo com o fator de Zoom Máx (se você escolheu a Movimentação livre no Tipo de movimento) ou em proporção à Altura (se você selecionou Vista panorâmica horizontal ou Vista panorâmica vertical como Tipo de movimento). A imagem resultante será maior do que a área disponível para exibi-la, e poderá ser movida em torno dela.

Mover e ampliar a imagem automaticamente: esta opção é bem semelhante à anterior, exceto que você pode deslocar a imagem movendo o mouse próximo às bordas.

Se você selecionar Redimensionamento automático da imagem como Modo de exibição, você pode selecionar as seguintes Configurações:

§Qualidade: este é o nível de qualidade que será mantido quando a imagem for salva no formato .JPG. Todas as imagens importadas são automaticamente convertidas para o formato .JPG, ou para .PNG se tiver configurado alguma transparência. Quando um arquivo é salvo no formato .JPG, quanto mais ele for compactado, pior será sua qualidade.

É melhor usar arquivos de imagens nos formatos .JPG, .GIF e .PNG. Se você adicionar imagens que não estejam nos formatos .JPG, .GIF ou .PNG, elas serão automaticamente convertidas para o formato .JPG, de acordo com o nível de compressão especificado. Arquivos são convertidos para .JPG (ou .PNG se houver transparência aplicada a eles) mesmo se a imagem for maior do que a célula onde estiver na tabela de layout de página e se for editada com o Editor de imagens.

Em todos os outros casos, a imagem é copiada do jeito que está, para manter a transparência aplicada a arquivos .GIF.

§Método de redução: esta opção indica como o tamanho da imagem será reduzido (largura e altura). Você pode escolher entre:

-Bilinear (mais rápido): este é o método mais rápido de reamostragem, mas renderiza uma imagem de menor qualidade que os outros métodos.

-Decimal (médio): este método é razoavelmente rápido e renderiza uma imagem de boa qualidade.

-Bicúbico (lento mas preciso): este é o método mais lento, mas renderiza uma imagem de alta qualidade.

Se você selecionar Mover e ampliar a imagem manualmente ou Mover e ampliar a imagem automaticamente como Modo de exibição você poderá trabalhar com as seguintes Configurações:

§Tipo de movimento: você pode indicar a direção na qual a imagem pode ser movida, manual ou automaticamente. Pode ser:

-Movimentação livre: a imagem pode ser arrastada horizontal ou verticalmente. Especifique o Zoom máximo: por exemplo, um fator de zoom de 200% exibirá a imagem duas vezes maior que seu tamanho original.

Foto original | Foto com efeito aplicado

-Vista panorâmica horizontal: a imagem só pode ser arrastada horizontalmente. Este efeito funciona melhor em imagens cuja largura seja maior que a altura. Especifique a altura da imagem em pixels no campo Altura.

Foto original | Foto com efeito aplicado

-Vista panorâmica vertical: a imagem só pode ser arrastada verticalmente. Este efeito funciona melhor com fotos cuja altura é maior que a largura. O valor no campo Altura é a altura, em pixels, que você deseja manter para a célula na tabela de layout de página.

Foto original | Foto com efeito aplicado

§Zoom máximo: esta opção só fica disponível para a opção Movimentação livre. Você pode configurar o fator de zoom para a imagem de modo que ela fique maior que a área disponível para visualizá-la. Se a imagem não fosse ampliada, você não conseguiria arrastá-la.

§Altura: esta opção só fica disponível para as opções Vista panorâmica horizontal e Vista panorâmica vertical. No primeiro caso você pode configurar a algura da imagem em pixels, e no segundo caso você pode configurar a altura da célula na tabela de layout de página onde a imagem é exibida.

§Permitir ampliação da imagem: esta opção fica ativa por padrão. A imagem pode ser ampliada ou reduzida com a roda do mouse. Quando a página é aberta, a imagem é exibida no seu tamanho original e o ícone no canto inferior direito indica que o zoom está disponível. A imagem será ampliada/reduzida quando a roda do mouse for girada, até que chegue ao tamanho estabelecido em Zoom máximo.

§Exibir a Barra de Zoom: esta opção só fica disponível se Permitir ampliação da imagem estiver ativo. A imagem pode ser ampliada/reduzida deslizando o cursor da barra de zoom para a esquerda ou para a direita.

§Exibir o navegador: esta opção exibirá uma pequena janela dentro da imagem com uma miniatura da própria imagem. O navegador é usado para realçar uma parte específica da imagem. Os visitantes podem arrastar o navegador pela imagem para realçar partes diferentes. O navegador desaparece quando o cursor é afastado da imagem.

§Habilitar movimento contínuo automático: se você selecionar esta opção, a imagem continuará a se mover enquanto estiver visível. Isto pode ser útil para indicar ao visitante que a imagem pode ser ampliada. O movimento contínuo automático é interrompido quando o visitante move a roda do mouse ou o cursor da barra de zoom.

Se você tiver configurado o Redimensionamento automático da imagem como Modo de exibição para a imagem em que estiver trabalhando, você pode definir o Efeito sob cursor:

§Efeito sob cursor: você pode especificar um efeito especial para quando o cursor do mouse passar sobre a imagem (mouseover).

§Configurações: variam de acordo com o tipo de Efeito sob cursor selecionado: eles dão os parâmetros que definem o efeito (por exemplo, a cor e a espessura das bordas para o efeito de "Borda colorida").

Você também pode usar as opções de Proteção para tentar evitar a cópia não autorizada das suas fotos:

§Proteger imagem contra cópias: protege a imagem, evitando que seja copiada por comandos do tipo Salvar como que os menus nos navegadores costumam oferecer.
Clique para expandir/recolher Referência: Comandos na aba Sitemap

Você pode usar os comandos nesta aba para fornecer maiores informações sobre a sua imagem, que serão usadas no SiteMap.

Em primeiro lugar, selecione a opção Adicionar imagem ao Sitemap: as informações que você adicionar à imagem serão adicionadas no SiteMap que o WebSite X5 cria automaticamente (veja Criar SiteMap automaticamente em Configurações Gerais | Avançadas). As configurações a seguir podem ser definidas:

§Título: (parâmetro opcional) você pode dar um título à imagem.

§Legenda: (parâmetro opcional) você pode dar uma legenda à imagem ou uma breve descrição.

§Localização geográfica (p.ex. Endereço, Cidade, etc): (parâmetro opcional) você pode dar uma informação geral, como um endereço, cidade ou país que ajudem a localizar a imagem geograficamente.

§URL da licença: (parâmetro opcional) você pode fornecer a URL do arquivo que contém a licença de uso da imagem.

Informações sobre imagens que são protegidas contra cópias não autorizadas não podem ser incluídas no SiteMap (veja Proteger imagem contra cópias na seção anterior, Exibição).

Melhores práticas:

-

Como criar e vincular o SiteMap do seu website


Objeto Tabela

Passo 3 - Criação da página >

Objeto Tabela

 Return to chapter overview
Exibir/Ocultar o texto oculto

Tabelas são muito úteis para organizar e apresentar dados.

Tabelas podem frequentemente apresentar informações de forma mais clara do que um texto longo e prolixo. Se você usar uma tabela para apresentar uma lista de preços para um hotel, por exemplo, dando o custo de diferentes tipos de quartos em diferentes épocas do ano, será muito mais claro e fácil de ler do que páginas repletas de textos dando as mesmas informações.

Tabelas também podem conter gráficos, que ajudem a tornar a página mais atraente e quebrar a monotonia de um texto longo.

Se você usar uma tabela para apresentar informações, certifique-se que não seja muito complicada, que as informações são apresentadas de forma clara e lógica, e que a tabela seja atraente e fácil de interpretar.

WebSite X5 fornece um editor para criar tabelas que é muito semelhante ao editor usado para o Objeto Texto. Por padrão, o editor exibe uma tabela de 2 linhas x 3 colunas, e que cobre toda a largura da célula da tabela de layout de página onde ela foi inserida. Você pode adicionar mais linhas e colunas, alterar seu tamanho e mesclar ou dividir as célular conforme o necessário.

Clique para expandir/recolher Referência: Comandos para o editor de Tabela

A barra de ferramentas do editor contém os seguintes comandos:

Cortar [CTRL+X] - Copiar [CTRL+C] - Colar [CTRL+V]

Estes comandos cortam, copiam e colam o texto selecionado. O texto colado perderá todas as opções de formatação (negrito, itálico, etc) aplicadas no documento original, e receberá as opções equivalentes deste editor.

Colar especial

Use este comando se quiser colar um texto que tenha sido recortado ou copiado com o comando Cortar e Copiar , para o qual você queira manter a formatação original.

Desfazer [CTRL+Z] - Refazer [ALT+CAPS+BACKSPACE]

Estes comandos desfazem/refazem a última operação a ser feita/desfeita.

Inserir link [CTRL+L]

Este comando insere um link na(s) palavra(s) selecionada(s). Você pode definir o link na janela Link que se abrirá.

Inserir Imagem

Insere uma imagem (no formato .JPG, .GIF, .PNG ou .BMP) na célula da tabela. Você pode usar os controles de seleção na imagem para redimensioná-la.

Habilitar código HTML

Você pode adicionar código HTML diretamente na tabela. No modo HTML, os caracteres < e > não são interpretados como "menor que" e "maior que", em vez disso, qualquer coisa entre eles será interpretado como uma tag HTML.

Configurações de RollOver

Você pode aplicar um efeito de rollover ao texto, de modo que ele possa ser rolado. As configurações para o rollover são definidas na janela RollOver .

Fundo claro/escuro

Esta opção estabelece uma cor escura ou clara para o plano de fundo do editor: isto pode ser útil se estiver trabalhando em um texto escrito em branco ou outra cor clara.

Inserir Linha / Remover Linha / Inserir Coluna / Remover Coluna

Estas opções adicionam uma linha ou uma coluna após aquela onde o cursor estiver posicionado, ou remove a linha ou coluna onde o cursor estiver posicionado.

Mesclar células - Dividir célula

Estas opções mesclam as células adjacentes para formar uma única célula, ou divide a célula selecionada verticalmente para criar duas células adjacentes horizontalmente.

Tipo de Fonte - Tamanho da Fonte

Você pode escolher o tipo de letra (fonte) que irá usar no seu texto, e seu tamanho.

O menu de lista suspensa mostra todas as fontes que estão disponíveis no seu computador. Lembre-se que se você escolher uma fonte que não esteja disponível no computador do visitante, ela será automaticamente substituída por uma fonte que seja similar à configuração original.

Negrito [CTRL+B] - Itálico [CTRL+I] - Sublinhado [CTRL+U]

Essas opções aplicam negrito, itálico e sublinhado ao texto selecionado.

Cor da fonte - Cor do fundo

Estas opções definem a cor a ser usada para o texto selecionado, ou para o fundo da célula que contém o texto selecionado.

Estilo da borda

Esta opção define o estilo para as bordas da célula. Você pode definir a cor e a espessura das bordas que separam as linhas e as colunas na tabela.

Lista de marcadores

Você pode adicionar uma lista de marcadores.

Alinhar à esquerda - Centralizar - Alinhar à direita - Justificar

Você pode alinhar o texto selecionado à esquerda, à direita, centralizado ou justificado.

Texto à direita - Normal - Texto à esquerda

Estas opções ficam disponíveis quando uma imagem é inserida em uma célula da tabela. Elas são usadas para indicar se o texto deve ficar à esquerda ou à direita da imagem, ou em torno dela.

Alinhar no topo - Alinhar pelo meio - Alinhar embaixo

Estas opções alinham verticalmente o texto selecionado pelo topo, pelo centro ou por baixo na célula.

Clique com o botão direito do mouse para abrir um menu popup que inclui os comandos Desfazer, Cortar, Copiar, Colar, Colar Especial e Selecionar Tudo e:

§Altura da linha

Você pode determinar o valor em pixels para a largura das linhas selecionadas. Se este valor for definido como 0, as linhas serão automaticamente configuradas com a menor altura necesssária para exibir o conteúdo.

§Largura da coluna

Você pode determinar o valor em pixels para a largura das colunas selecionadas.

O tamanho das linhas, colunas, e células individuais pode ser alterado arrastando as bordas da célula com o mouse, mantendo o botão esquerdo pressionado. Se você selecionar uma célula e mover a borda esquerda e/ou direita, somente o tamanho daquela célula será alterado.


Objeto Galeria

Passo 3 - Criação da página >

Objeto Galeria

 Return to chapter overview
Exibir/Ocultar o texto oculto

Câmeras digitais e serviços online de fotos estão tão difundidos atualmente que é extremamente fácil publicar e compartilhar na internet coletâneas inteiras de fotos. Você pode publicar seus álbuns de família e compartilha-los com parentes e amigos onde quer que estejam no mundo. Ou você pode criar álbuns e catálogos dos seus hobbies e para o trabalho.

Com o WebSite X5 você pode incluir galerias incríveis para mostrar não só as suas fotos mas também seus vídeos. Cada galeria tem efeitos, métodos de navegação e exibições diferentes: elas podem, por exemplo, ter uma barra de controle ou miniaturas, e como estes elementos são exibidos pode ser diferente. Todas as galerias usam JavaScript e tiram partido do HTML5 e do CSS3 para criar efeitos de exibição.

Observações sobre compatibilidade com as versões anteriores:

Galeiras HTML5 x Galerias em Flash - As galerias em HTML5 foram introduzidas pela primeira vez na versão 9.1 do WebSite X5 e na versão 10 elas substituem completamente as galerias anteriores em Flash.

As galerias em Flash foram substituídas pelas galerias em HTML5 porque, apesar delas disponibilizarem muitos efeitos de exibição, elas requerem o Flash player para serem exibidas e este recurso não é supertado em tablets e outros dispositivos móveis com sistema operacional iOS (por exemplo, iPad® e iPhone®). As galerias HTML5, por outro lado, carregam mais rapidamente, não requerem plug-ins e são exibidas corretamente em todo tipo de dispositivo e por todos os sistemas operacionais modernos.

Se você estiver usando uma versão de navegador que não suporta HTML5 e CSS3, as galerias em HTML5 serão exibidas, mas alguns dos efeitos de exibição aplicados às imagens podem não ser tratados corretamente. Nestes casos, o efeito Dissolver é aplicado automaticamente.

Se uma galeria incluir um vídeo cujo formato não é suportado pelo HTML5, ou se o navegador não dá suporte a este vídeo em HTML5, ele será automaticamente exibido em Flash para garantir sua reprodução correta.

Algumas das galerias disponíveis oferecem os recursos de miniaturas e uma janela ShowBox onde as imagens das miniaturas são exibidas ampliadas. O visitante só precisa clicar na miniatura para abrir a imagem ou o vídeo na ShowBox, que é sobreposta à página. Ao mover o mouse sobre a janela da ShowBox aparecem botões para exibir a foto ou o vídeo anterior/próximo da galeria, sem ter que voltar para as miniaturas.

Você pode personalizar a aparência da janela ShowBox as opções na aba Estilos e Modelos | ShowBox do Passo 4 - Configurações Avançadas.

Os comandos para criar um Objeto Galeria ficam nas abas Estilo, Lista e Miniaturas.

Clique para expandir/recolher Referêcia: Comandos na aba Estilo

Você pode usar os comandos nesta aba para escolher o tipo de galeria que deseja criar, e definir algumas configurações gerais para ela.

As opções de galerias incluem:

Clique para expandir/recolher | Apresentação de slides clássica Em uma galeria deste tipo, as fotos e os vídeos são exibidos em sequência, um após o outro: o modo em que as fotos são exibidas depende do efeito de entrada que foi configurado. Os comandos para passar de uma imagem para outra ficam na barra de controle. Você também pode ter miniaturas na barra de controle, e elas permitem que os visitantes abram uma determinada foto ou vídeo imediatamente, sem ter que acompanhar a sequência.
Clique para expandir/recolher | Galeria horizontal Neste tipo de galeria as miniaturas são exibidas em primeiro plano acima ou abaixo da imagem. As miniaturas se deslocam à esquerda/direita quando o cursor do mouse é colocado sobre elas: clicar em uma miniatura abre a foto ampliata ou o vídeo em primeiro plano. As fotos ampliadas vão aparecer com o efeito de entrada que tenha sido configurado para elas.
Clique para expandir/recolher | Galeria vertical Este tipo de galeria é o mesmo que o anterior, exceto que as miniaturas são exibidas verticalmente, no lado esquerdo ou direito da imagem em primeiro plano.
Clique para expandir/recolher | Miniaturas Esta galeria também exibe miniaturas, e quando uma é clicada, a foto ou o vídeo correspondente se abre em primeiro plano na ShowBox.
Clique para expandir/recolher | Miniaturas por bloco Este tipo de galeria é muito semelhante ao anterior, com a única diferença que você pode dividir as fotos em blocos e especificar quantas fileiras de miniaturas serão exibidas. O visitante se desloca entre os blocos, usando a barra de botões, e permanece na mesma página do site. Este tipo de galeria é útil se você tiver muitas fotos para incluir na sua galeria.
Clique para expandir/recolher | Miniaturas horizontais Neste tipo de galeria, as miniaturas são exibidas em uma única fila horizontal. A foto ou vídeo selecionada entre as miniaturas é exibida na ShowBox.
Clique para expandir/recolher | Miniaturas verticais Esta opção é a mesma que a anterior, exceto que as miniaturas são exibidas verticalmente.

Os diversos tipos de galeria têm diferentes Configurações e opções para seusr Comandos de navegação.

Configurações: | Apresentação de slides clássica | Galeria horizontal | Galeria vertical
§Tamanho máximo: define a largura e altura máxima, em pixels, das fotos. Deixe o Manter proporções selecionado para manter a proporção entre a largura e a altura. | P | P | P
§Miniaturas visíveis: estabelece a quantidade de miniaturas que serão exibidas próximas à foto principal. | - | P | P
§Posição da miniatura: define onde as miniaturas serão exibidas em relação à foto principal. | - | P | P
§Fonte da descrição:especifique a fonte, o estilo e o tamanho a ser usado no texto. Estas configurações são usadas para as legendas que você pode criar no campo Descrição na aba Lista. | P | P | P
§Trilha sonora: especifica o arquivo de som que será usado como trilha sonora que será executada quando a galeria for exibida. | P | P | P
§Início automático: A apresentação de fotos e vídeos inicia assim que a galeria abrir. | P | P | P
§Visualização aleatória: as fotos e os vídeos são exibidos em uma ordem aleatória, e não na sequência em que foram inseridos. | P | P | P
Comandos de navegação:
§Visualização dos botões: define se e como os botões de navegação serão exibidos próximos à foto principal na galeria para passar para a próxima/anterior. Os botões podem ser Sempre visível, Não é visível (reprodução automática) ou Visível sob cursor. | P | - | -
§Estilo dos botões: você pode escolher o estilo dos botões que serão exibidos próximos à foto principal da galeria. | P | - | -
§Exibir barra de controles: fica ativado por padrão: uma barra de controle aparece quando o cursor do mouse passa em cima, exibindo os controles que podem ser usados para ver as fotos e vídeos da galeria. Os controles básicos são [image] Iniciar apresentação, [image] Foto anterior e [image] Próxima foto. | P | P | P
§Cor: especifica a cor de fundo da barra de controle. | P | P | P
§Exibir miniaturas na barra de controles: fica ativado por padrão: adiciona uma lista de miniaturas das imagens na galeria à barra de controle, que é exibida quando o cursor do mouse passa por cima. O visitante não tem que acompanhar a sequência da apresentação, mas pode escolher as imagens ou vídeos que deseja ver. | P | - | -

Configurações: | Miniaturas | Miniaturas por bloco | Miniaturas horizontais | Miniaturas verticais
§Miniaturas visíveis: estabelece a quantidade de miniaturas que serão exibidas próximas à foto principal. | P | - | P | P
§Linhas por página: define a quantidade de fileiras em que as miniaturas das fotos serão organizadas. | - | P | - | -
§Mostrar a imagem ampliada ao clicar no ShowBox: cria o link nas miniaturas que corresponde à foto ou vídeo que será exibido na ShowBox. | P | P | P | P
§Tamanho máximo: só fica disponível se a opção Mostrar a imagem ampliada ao clicar no ShowBox estiver ativa: define a largura e altura máxima, em pixels, da janela ShowBox. Deixe o Manter proporções selecionado para manter a proporção entre a largura e a altura. | P | P | P | P
Clique para expandir/recolher Referência: Comandos na aba Lista

Você pode usar estes comandos para definir a lista de fotos e vídeos que serão adicionados à galeria.

Todos os arquivos que já tenham sido importados são exibidos na lista Arquivo de imagem: selecione um arquivo da lista para visualizá-lo.

A lista Arquivo de imagem mostra o caminho do arquivo, o efeito de entrada associado a ele, e marca se o arquivo tem um link e uma descrição.

Os comandos para se criar um objeto galeria são:

§Adicionar... / Remover: adiciona novos arquivos ou remove os selecionados que já haviam sido adicionados. Você pode importar arquivos de imagem nos formatos .JPG, .GIF, .PNG, .PSD, .BMP, .TIF, .DIB, .PCX, .RLE, .TGA e .WMF. Você pode importar arquivos de vídeo nos formatos .FLV e .MP4.

Clique no triângulo do botão Adicionar... para exibir um sub-menu que tem as seguintes opções: Adicionar imagem..., Adicionar vídeo... e Adicionar vídeo YouTube/Vimeo....

Clique para expandir/recolher

Na janela exibida pelo comando Adicionar vídeo YouTube/Vimeo..., você pode especificar o endereço URL dos vídeos que deseja adicionar a partir de portais como o YouTube™ e Vimeo.

§Para cima / Para baixo: você pode alterar a posição dos arquivos na lista Arquivo de imagem.

§Editar...: abre o Editor de imagens onde você pode modificar a foto selecionada na lista Arquivo de imagem.

Dependendo do tipo de galeria que você selecionou, você poderá definir as Opções para cada foto/vídeo que tenha sido inserido.

§Link: cria um link na foto/vídeo selecionados entre os da lista. Clique no botão [image] para abrir a janela Link onde poderá selecionar a ação e opções relacionadas. Se você optou por uma galeria que usa miniaturas de fotos, o link que você criar substitui o que amplia a foto, mesmo se a opção Mostrar a imagem ampliada ao clicar no ShowBox estiver ativa.

§Efeito: quando você clica no botão [image] a janela Propriedades do efeito se abre e é onde você poderá definir os efeitos de entrada, movimento e zoom para as fotos/vídeos selecionados a partir da lista Arquivo de imagem.

Se você estiver usando uma versão de navegador que não suporta HTML5 e CSS3, as galerias em HTML5 serão exibidas, mas alguns dos efeitos de exibição aplicados às imagens podem não ser tratados corretamente. Nestes casos, o efeito Dissolver é aplicado automaticamente.

§Descrição: você pode inserir uma descrição para a foto/vídeo selecionada na lista Arquivo de imagem neste campo. O texto da descrição é exibido na parte inferior da janela onde a imagem ou vídeo ampliado será exibido.
Clique para expandir/recolher Referência: Os comandos na aba Miniaturas

Você pode usar os comandos nesta aba para definir a aparência das miniaturas nas galerias que as contêm.

Uma miniatura é uma versão reduzida da foto ou do vídeo em uma galeria, e é criada automaticamente pelo programa. As miniaturas são exibidas em molduras que podem fazer com que se pareçam com slides, negativos, post-its, etc.

Estes comandos são para definir a aparência das miniaturas:

§Imagem pré-definida: você pode escolher a moldura para a miniatura dentre a coleção existente.

§Imagem personalizada: você pode acrescentar o arquivo de imagem (no formato .JPG, .GIF, .PNG, .BMP, .PSD, .TIF, .DIB, .PCX, .RLE, .TGA ou .WPG) que corresponde à moldura que deseja usar.

Para criar uma nova moldura, prepare a imagem e salve-a em um arquivo. Você deverá criar molduras quadradas e salvá-las no formato .PNG, se quiser manter uma transparência.

As seguintes Opções também estão disponíveis para as miniaturas:

§Margem externa da imagem (%): você pode especificar a margem entre a miniatura e a moldura.

§Ativar saturação de cor: você pode especificar a cor de saturação da moldura da miniatura. Um efeito de coloração é aplicado à imagem da moldura para que ela adquira a cor solicitada.

A saturação se cor não tem efeito algum nas molduras em preto e branco.

As galerias podem ser iniciadas por links nas páginas: veja Link para maiores informações.


Objeto Vídeo/Som

Passo 3 - Criação da página >

Objeto Vídeo/Som

 Return to chapter overview
Exibir/Ocultar o texto oculto

Com o WebSite X5 você poderá enterter os visitantes do seu site adicionando vídeos e música.

Os vídeos estão vivendo seu momento de glória: todo mundo consegue fazer um vídeo, copiá-lo no computador, editá-lo e então publicá-lo na Internet.

Com o WebSite X5 fica muito fácil importar todos os tipos de vídeo, adicioná-los ao seu website e compartilhá-los. O WebSite X5 aceita todos os formatos principais e tem um reprodutor de vídeo embutido para arquivos .FLV e .MP4. Você pode importar arquivos do seu computador ou encontrados na Internet, includindo os de portais do tipo YouTube™ e Vimeo.

Os comandos para se criar um Objeto Vídeo/Som ficam orgnizados nas abas Geral e Sitemap.

Clique para expandir/recolher Referência: Comandos na aba Geral

Usando os comandos nesta aba você consegue importar o arquivo que será usado para criar um Objeto Vídeo/Som e dar as indicações necessárias sobre como ele deverá ser executado.

O Objeto Vídeo/Som pode ser adicionado de diversas formas, dependendo de onde vem o arquivo importado:

§Arquivo local: se selecionar esta opção, basta clicaar no botão [image] para buscar o arquivo no seu computador e escolher um para importar. O arquivo precisa estar no formato .MP4, .WEBM, .OGG, .FLV, .AVI, .WMV, .MPG, .MOV, .MP3, .WMA, .WAV, .MID, .AIF ou .M4A.

§Arquivo na internet: se selecionar esta opção, insira o endereço URL onde o arquivo de vídeo ou de áudio será encontrado na Internet.

§URL do vídeo no YouTube/Vimeo: se selecionar esta opção insira o endereço URL onde o arquivo de vídeo/áudio que deseja importar pode ser encontrado em portais do tipo YouTube™ ou Vimeo.

Se você importar um vídeo do YouTube™, ele será redimensionado de acordo com as configurações feitas no WebSite X5. Se desejar manter o tamanho original, poderá importar um vídeo do YouTube™ usando o Objeto HTML e Widgets em vez do Objeto Vídeo/Som.

Você pode exibir uma pré-visualização do objeto vídeo/som importado, selecionando a opção Pré-visualizar.

Diferentes Players são usados para tocar os diversos formatos de arquivo de Vídeo/Som. Se o navegador der suporte à tag video do HTML5 e ao codec do arquivo, então será usado o Media Player do WebSite X5 para exibir/executar arquivos nos formatos .MP4, .WEBM e .OGG. Todos os outros formatos são tratados conforme mostrado na tabela:

Player | Arquivo de Vídeo | Arquivo de Som
Adobe Flash Player® | .MP4 e .FLV | .MP3
Microsoft® Windows Media Player® | .AVI, .WMV e .MPG | .WAV e .WMA
QuickTime® Player | .MOV | .M4A e .AIF

Para garantir máxima compatibilidade, é melhor usar .MP4.

Qualquer que seja o player usado para exibir/executar o arquivo importado, você pode definir as seguintes Propriedades:

§Texto alternativo: insira o texto que será exibido caso o Vídeo/Som não possa ser tocado por algum motivo.

§Tamanho: insira a largura, em pixels, da barra de controles do vídeo ou do áudio. A largura máxima para o objeto é mostrada entre parenteses, de acordo com as configurações na tabela de layout de página. A altura máxima para a barra de controle do áudio (35 pixels) é exibida entre parenteses. A altura mínima é de 15 pixels. Deixe o Manter proporções selecionado para manter a proporção entre a largura e a altura.

§Início automático: se marcado, o vídeo/som começará automaticamente.

§Habilitar visualização em tela cheia: o botão de tela cheia aparecerá na barra de controles do vídeo.

Você pode definir como a Barra de controles será exibida:

§Exibir barra de controles: exibe uma barra de botões com todos os controles para o vídeo/som.

Se o Media Player do WebSite X5 for usado para exibir/executar o arquivo, você também pode escolher as seguintes opções para a Barra de controles:

§Ocultar a Barra de controles automaticamente: a barra de controle aparece quando o cursor do mouse estiver sobre a janela onde o vídeo/som estiver sendo executado.

§Cor: define a cor de fundo da barra de controle.

O Media Player do WebSite X5 não é usado para vídeos no formato Microsoft® ou QuickTime®, e isto poderia causar problemas ocasionais com a barra de controle.
Clique para expandir/recolher Referência: Comandos na aba Sitemap

Use os comandos nesta aba para fornecer maiores informações que podem ser úteis para completar o SiteMap.

Em primeiro lugar, selecione a opção Adicionar vídeo ao Sitemap: as informações sobre o vídeo serão adicionadas ao SiteMap que é criado automaticamente pelo WebSite X5 (veja Criar SiteMap automaticamente em Configurações Gerais | Avançadas). Então você deverá definir os seguintes parâmetros:

§Título: (parâmetro obrigatório) especifica o título a ser dado ao vídeo. O Google™ aceita 100 caracteres como comprimento do título

§Legenda: (parâmetro obrigatório) especifica uma breve descrição do vídeo. O Google™ aceita 2048 caracteres para a descrição: textos mais longos serão cortados.

§Categoria: (parâmetro opcional) especifica a categoria para o vídeo, de acordo com seu conteúdo. O Google™ estipula que um vídeo só pode pertencer a uma única categoria, e o nome da categoria não pode exceder 256 caracteres.

§Palavras-chave: (parâmetro opcional) especifica uma lista de tags (marcadores), ou descrições curtas dos principais aspectos do vídeo. O Google™ permite no máximo 32 tags para cada vídeo.

§Imagem de Pré-visualizção do vídeo: (parâmetro obrigatório) especifica uma imagem associada ao vídeo. O Google™ aconselha a dar a estas miniaturas um tamanho mínimo de 120x90 pixels e a salvá-las no formato .JPG, .PNG ou .GIF.

§Data de publicação: (parâmetro opcional) especifica a data de publicação do vídeo.

§Duração (seg): (parâmetro opcional) especifica a duração do vídeo, em segundos. O Google™ recomenda que você forneça esta informação, e que especifiqua que a duração deve ficar entre 0 e 28800 segundos (8 horas).

§Conteúdo apropriado a todas as idades: (parâmetro opcional) este parâmetro é usado para especificar se o conteúdo de vídeo é adequado para crianças. O Google™ avisa que, se um vídeo não for indicado ou adequado para crianças, ele só ficará visível para usuários que tenham desligado o recurso do filtro Google Safesearch™. O recurso do Google™ Safesearch filtra sites com conteúdo sexual explícito ou pornográfico e remove-os dos resultados das suas buscas.

Melhores práticas:

-

Como criar e vincular o SiteMap do seu website


Objeto Formulário de Email

Passo 3 - Criação da página >

Objeto Formulário de Email

 Return to chapter overview
Exibir/Ocultar o texto oculto

Quando você está navegando na Internet, frequentemente se depara com páginas que exibem um formulário que pedem para você preencher com detalhes pessoais. Estes formulários podem ser uma forma de entrar em contato com o site, para se cadastrar e receber informações, para acessar Áreas Restritas, ou simplesmente pesquisas de opinião ou de mercado.

Qualquer que seja o objetivo, com o WebSite X5 você pode criar um formulário de email muito facilmente. Você pode especificar os campos que quer que ele tenha, decidir o layout da página e o aspecto gráfico dele, e, mais importante, estipular como os dados devem ser coletados e quem os receberá.

Os comandos para se criar um Formulário de email estão organizados nas abas Lista, Envio e Estilo.

Clique para expandir/recolher Referência: Comandos na aba Lista

Use os comandos nesta aba para definir a lista de campos que você quer que apareçam nos seus formulários de email.

Todos os campos existentes são exibidos na tabela, que fornece informações para: Nome do Campo, Tipo do campo, Largura, se ele é Obrigatório e a Descrição. Estes parâmetros podem ser definidos ao criar um campo, na janela Inserir Campo.

Além de resumir os pontos importantes de cada campo, a tabela também pode ser usada para trabalhar neles:

§Dê um duplo clique em um campo em Inserir Campo, para abrir a janela onde você poderá alterar qualquer valor inserido anteriormente;

§Clique uma segunda vez em um campo selecionado para alterar seu nome (você também pode fazer isso abrindo a janela Inserir Campo e alterando o texto inserido como legenda;

§Selecione um campo e use os comandos da barra de botões para copiar um campo, removê-lo, movê-lo para cima ou para baixo ou para alterar suas configurações.

Você também pode checar o layout dos campos no formulário. Uma lista pontilhada indica quantas linhas existem no campo. Se um campo estiver na mesma linha que o campo anterior, o ícone [image] é exibido ao lado da sua largura. Se a largura de todos os campos na mesma linha exceder a largura total da linha, o ícone [image] sinaliza este erro. Se você não alterar as larguras para corrigir este erro, os campos que não couberem na linha serão exibidos na linha seguinte.

Os comandos para criar a lista de campos no formulário são exibidos ao lado da tabela:

§Adicionar...: abre a janela Inserir Campo, onde você pode adicionar um novo campo ao formulário.

§Duplicar: você pode criar uma cópia do campo selecionado.

§Remover: você pode remover o campo selecionado do formulário.

§Para cima / Para baixo: você pode alterar a ordem dos campos, movendo o que estiver selecionado uma posição para cima ou para baixo na lista.

§Editar...: abre a janela Inserir Campo, onde você pode alterar as configurações para o campo selecionado.

Os botões Enviar e Limpar (para enviar o formulário compilado e para remover toda a informação adicionada ao formulário) são adicionados automaticamente pelo programa no final do formulário.
Clique para expandir/recolher Referência: Comandos na aba Envio

Use os comandos nesta aba para definir como os dados enviados pelos formulários de email deverão ser tratados.

Na caixa Envio dos dados você tem que especificar como o Administrador do website deverá receber os dados. Você tem as seguintes opções:

Enviar dados por email: é a opção padrão. Os dados enviados via formulários são enviados automaticamente por email, usando um script PHP.

Enviar dados para um banco de dados: os dados enviados via formulário são enviados automaticamente ao banco de dados MySQL pré-determinado, usando um script PHP.

Enviar dados para um arquivo: Os dados enviados usando o formulário são salvos em um formato específico de script (.PHP, .ASP, etc.). Esta opção é útil se você quiser usar seu próprio script, por exemplo se o .PHP não estiver disponível no seu servidor, ou se você quiser incluir um determinado procedimento ou implementar procedimentos de gerenciamento de dados específicos.

Você deve configurar vários parâmetros para cada opção de envio:

Enviar dados por email:

§Email do remetente: indica o endereço a partir do qual enviar o email de resposta aos dados enviados via formulário.

Por padrão, o endereço do remetente é o mesmo do destinatário que, neste caso, é o do administrador do site. Se você especificar que o endereço do remetente deverá ser o do visitante que preencheu o formulário, é possível, por exemplo, usar o comando Responder email.

§Email do usuário: indica o endereço que receberá os dados enviados através dos formulários. Você pode inserir mais de um endereço: separe-os com ponto-e-vírgula (;).

§Objeto: indica o assunto do email que contém os dados fornecidos pelo visitante.

§Mensagem: é o texto que será usado no email.

§Incluir os dados coletados no formato CSV: os dados fornecidos nos formulários também são gravados em um arquivo .CSV, e adicionados ao email. Dados em um arquivo .CSV são escritos no formato de texto, como uma longa lista de itens, separados por ponto-e-vírgula (;): esses arquivos podem ser facilmente importados em programas de planilhas (Microsoft Excel, por exemplo).

Enviar dados para um banco de dados:

§Banco de dados: selecione o banco de dados dentre a lista dos que estão vinculados ao projeto. Use os comandos na janela Gerenciamento de Dados para criar a lista de bancos de dados associados ao projeto.

§Nome da tabela: insira o nome da tabela no banco de dados na qual deseja que os dados enviados sejam adicionados. Se a tabela não existir, será criada automaticamente.

§Enviar email de notificação da recepção de dados: será enviado um aviso por email quando novos dados chegarem.

§Email do usuário: Você deve definir alguns parâmetros para cada opção de envio:

insira o endereço do destinatário que irá receber os emails de aviso de recebimento de dados.

Enviar dados para um arquivo:

§Arquivo de script (ex PHP, ASP): você pode importar o arquivo com o script que será usado para coletar e enviar dados fornecidos via formulários. Você deverá criar o arquivo de script manualmente.

Se você não selecionar Enviar dados para um arquivo como método de Envio dos dados em Email de confirmação para o usuário, as opções a seguir serão exibidas:

§Enviar email de confirmação para o usuário: selecione esta opção se desejar que o visitante recebe uma confirmação automática por email quando ele enviar dados via formulário.

§Email do remetente: insira um endereço de email válido e ativo para usar como remetente do email de confirmação.

Por padrão o endereço do remetente do email de confirmação, que neste caso é o do administrador do website, é o endereço fornecido como Email do usuário na aba Envio dos dados. Insira um Email do remetente diferente se desejar que a mensagem de confirmação seja enviada de outro endereço, em vez do email que recebe os formulários enviados. Esta opção é útil se você preferir se comunicar com os visitantes usando um endereço genérico (do tipo info@minhaempresa.com ou noreply@minhaempresa.com) em vez de um endereço pessoal (nome.sobrenome@minhaempresa.com).

§Email do usuário: você pode especificar de qual campo do formulário de email o endereço do email de confirmação deverá ser obtido.

§Objeto: especifique o assunto do email de confirmação.

§Mensagem: especifique o conteúdo do email de confirmação.

§Incluir os dados coletados: adicione a data de envio ao final do email de confirmação.

Finalmente, você pode selecionar as seguintes Opções:

§Ativar filtro 'Captcha' anti-spam: você pode adicionar o filtro anti-spam Captcha no final do formulário de email. Uma série de letras distorcidas é exibida numa ordem aleatória: o visitante deverá copiá-las corretamente no campo indicado para poder enviar sua mensagem.

§Página de confirmação após o envio dos dados: esta opção exibe o Mapa do site onde você pode indicar qual página será exibida quando o formulário de email preenchido tiver sido enviado. É uma boa idéia designar uma página específica para este propósito, em vez de usar a Página Inicial, assim você poderá incluir uma nota de agradecimento na página. Esta página deve ser uma Página oculta: o comando para isto fica no Passo 2 - Criação do mapa.

Você pode personalizar o estilo dos emails que são enviados automaticamente, usando as opções na janela Estilos e Modelos | Email do Passo 4 - Configurações Avançadas.
Clique para expandir/recolher Referência: Comandos na aba Estilo

Use os comandos nesta aba para configurar o estilo do formulário de email que estiver criando.

Em primeiro lugar, selecione o Item do formulário no qual deseja trabalhar: escolha a partir do menu de lista suspensa ou clique no item na pré-visualização.

Você pode personalizar os seguintes itens:

Legendas: é um texto descritivo do campo e ou ele indica qual informação é solicitada ou faz uma pergunta.

Campos: é onde o visitante insere a informação necessária.

Botões de 'Enviar' e 'Limpar': esses botões são adicionados automaticamente no final do formulário de email. Eles servem, respectivamente, para enviar o email ou limpar todos os campos.

Descrição e validação dos campos: são mensagens que podem ser exibidas enquanto o formulário é preenchido. Eles fornecem informações adicionais, indicam dados incorretos, ou lembram o visitante se um campo obrigatório ainda não tiver sido prenchido.

As opções disponíveis para estes itens ficam na aba Estilo:

Legendas:

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Cor: especifica a cor que será usada no texto.

§Repetir: você pode indicar onde a legenda para os campos devem ficar. Há 3 opções: Mostrar as legendas acima dos Campos, Mostrar as legendas dentro dos Campos e Mostrar as legendas à esquerda dos Campos. Se optar por ter legendas à esquerda dos campos, você precisa especificar a Largura (%) como uma porcentagem da linha onde ela aparece, e também o Alinhamento das legendas.

Campos:

§Cor: indica a cor que será usada no texto (tanto para os estados normal e "selecionado"), para o plano de fundo (estados normal e "selecionado") e para a borda (estados normal e de "erro").

§Cantos arredondados: você pode definir o grau de arredondamento que cada canto deve ter.

§Sombra: aplica uma sombra dento do campo para dar uma impressão de profundidade.

Botões de 'Enviar' e 'Limpar':

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Cor: especifica a cor que será usada no texto, plano de fundo e bordas do botão.

§Cantos arredondados: você pode definir o grau de arredondamento que cada canto deve ter.

§Imagem de fundo: indica o arquivo (.JPG, .GIF, .PNG.) da imagem a ser usada como plano de fundo.

§Mostrar o botão de 'Limpar': fica ativo por padrão. Um botão de "Limpar" é adicionado automaticamente no final do formulário (para limpar o conteúdo dos campos que tiverem sido preenchidos), ao lado do botão "Enviar".

Descrição e validação dos campos:

§Arquivo do icone para a descrição do campo: você pode importar um arquivo de imagem (no formato .JPG, .GIF e .PNG) para usar como ícone ao lado do campo, indicando que maiores informações sobre ele estão disponíveis.

§Mostrar a Descrição no campo sob foco: selecione esta opção se quiser que uma mensagem com maiores informações seja exibida automaticamente quando o visitante clicar dentro do campo.

§Se ocorrer um erro durante a validação dos dados: você pode escolher como a mensagem padrão será exibida quando um campo for preenchido incorretamente ou quando um campo obrigatório não tiver sido preenchido. Você pode escolher entre Mostrar a janela de diálogo do Navegador, Mostrar janela popup interna ou Mostrar Tooltip junto ao Campo inválido.

Quando pré-visualizar seu website, uma mensagem lembrará você que os emails com dados não serão enviados. O recurso de Enviar Formulário de Email só fica totalmente funcional depois do website ter sido publicado no Servidor.

O recurso de Enviar Formulário de Email funcionará corretamente se o Servidor onde o website tiver sido publicado der suporte à linguagem de programação .PHP e se o comando MAIL estiver ativo. Você pode obter estas informações no diagnóstico do Servidor através da seção de Website Test do Painel de Controle.

Se ocorrerem problemas ao enviar emails, é possível que o Servidor que você está usando não tenha uma configuração padrão. Tente modificar as configurações do script e as usadas para enviar emails, usando as opções em Configurações Avançadas | Gerenciamento de Dados. Para maiores informações, entre em contato com seu provedor de hospedagem.


A janela Inserir Campo

Passo 3 - Criação da página > Objeto Formulário de Email >

A janela Inserir Campo

 Return to chapter overview
Exibir/Ocultar o texto oculto

A janela Inserir Campo se abre quando você pressiona os botões Adicionar... e Editar... na janela Objeto Formulário de Email. Aqui você pode criar e definir os campos do formulário de email.

Esta janela tem as seguintes abas: Tipo do campo e Opções.

Clique para expandir/recolher Referência: Comandos na aba Tipo do campo

Você pode usar as opções nesta seção para criar a lista de campos que irão compor seu formulário de email.

As opções disponiveis são

Campo de texto: uma linha única de texto exibida como uma caixa vazia que o visitante pode preencher como quiser.

Endereço de email: uma linha única de texto onde o visitante deverá inserir um endereço de email. Um filtro automático verifica se o formato do endereço: endereços de email válidos contêm o símbolo "@" e um "." (ponto).

Área de texto: este campo de texto cobre mais do que uma linha, e o visitante poderá fazer comentários ou perguntas.

Data: um campo de texto onde o visitante insere a data. Ela tanto pode ser digitada quanto escolhida em um calendário.

Lista suspensa: o visitante deverá escolher uma opção dentre as oferecidas na lista suspensa.

Lista: o visitante deverá selecionar uma opção entre as listadas.

Múltipla escolha: o visitante pode selecionar uma ou mais opções entre as listadas.

Escolha simples: o visitante só pode escolher uma das opções listadas.

Senha: um campo de texto onde os caracteres digitados são ocultos, e pontos ou asteriscos são exibidos no lugar das letras (dependendo do sistema operacional no computador do visitante). Esta prática é adotada para garantir a privacidade de um visitante quando ele inserir uma senha para acessar um serviço.

Anexar arquivo: um campo de texto onde o visitante pode designar um arquivo que será enviado anexado, usando o botão [image] para procurar entre seus arquivos disponíveis.

Entre em contato com seu provedor de hospedagem para verificar se arquivos anexados são tratados corretamente.

Pergunta de segurança: um campo de texto onde o visitante insere a resposta a uma pergunta. Essas perguntas têm a intenção de diferenciar uma pessoa de verdade de programas de spam que usam formulários de contato para enviar emails indesejados.

Termo de uso: um campo de texto informa as condições que o visitante deverá concordar para poder enviar o formulário. Este campo é usado, por exemplo, para exibir os termos de privacidade para o gerenciamento de dados fornecidos.

Separador: é um separador, e não um campo. E é usado para separar os campos em seções e tornar formulários longos mais fáceis de usar.

Várias opções podem ser apresentadas, dependendo do tipo de campo selecionado. As opções disponíveis para todos os campos são:

§Legenda: você pode dar uma descrição ao campo. Este texto será exibido acima, ao lado ou dentro do campo a que ele se refere, para explicar a informação solicitada ou para exibir uma pergunta feita ao visitante.

§Largura (%): você pode definir a largura do campo (de 5% a 100% do espaço disponível).

§Mostrar na mesma linha que o campo anterior: selecione esta opção se quiser que o campo fique na mesma linha que o campo anterior. Dois campos só podem ficar na mesma linha se sua largura total não ultrapassar a largura total da linha.

§Definir campo como obrigatório: esta opção torna o campo obrigatório para o visitante. Ela não fica disponível para os campos de Múltipla escolha, e fica ativa por padrão para os campos de Pergunta de segurança.

As opções a seguir são específicas a determinados campos:

Campo de texto:

§Número máximo de caracteres: especifique o número máximo de caracteres que podem ser inseridos neste campo. Por exemplo, você pode especificar um campo de no máximo 11 caracteres onde o visitante vai inserir o cpf.

§Filtro de inserção de texto: os dados inseridos pelo visitante serão checados. Os filtros possíveis são:

-Nenhum (caracteres e números): tanto caracteres quanto números são aceitos no campo.

-Somente números: somente números são permitidos.

-Fone/fax (números e os caracteres '-' e ' '): são aceitos números, o caractere "-" e espaços em branco.

-Data (números e os caracteres '/' e '.'): são aceitos números e o caractere "/".

Endereço de email:

§Solicitar confirmação de endereço de email: adiciona um outro campo onde o visitante deverá repetir seu endereço de email. A correspondência exata entre os dois campos é verificada automaticamente: se os campos não baterem, uma mensagem de alerta será exibida.

Área de texto:

§Número máximo de caracteres: especifique o número máximo de caracteres que podem ser inseridos neste campo.

§Número de linhas: especifique a altura do campo, fornecendo o número de linhas que serão exibidas (máx. 30).

Data:

§Formato da data: agora você pode escolher o formato para inserir a data, selecionando entre os formatos americano e internacional.

§Mostrar o ícone de 'Calendário': esta opção exibe o ícone "Calendário" ao lado do campo Data. Quando este ícone é cliado, o visitante pode selecionar a data a partir de um calendário, sem ter que digitá-la.

Lista:

§Número de linhas: especifique a altura do campo, fornecendo o número de linhas que serão exibidas (máx. 30).

Múltipla escolha/Escolha simples:

§Número de colunas: esta opção define o número de colunas onde serão exibidas as opções possíveis.

Senha:

§Solicitar confirmação de senha: adiciona outro campo onde o visitante deverá repetir sua senha. A correspondência exata ente os dois campos é verificada automaticamente. Se os campos não baterem, uma mensagem de alerta será exibida.

Pergunta de segurança:

§Resposta correta: este campo contém a resposta correta que deverá bater com a resposta fornecida pelo visitante.

Termo de uso:

§Texto do Termo: você pode inserir o texto do termo que o visitante deverá aceitar antes de enviar os dados.

Finalmente, você pode criar uma lista de respostas possíveis para os campos Lista suspensa, Lista, Múltipla escolha e Escolha simples, com os seguintes comandos:

§Adicionar / Remover: selecione uma alternativa para adicionar uma versão ou remover a atual.

§Para cima / Para baixo: você pode alterar a ordem das alternativas na lista, movendo o item selecionado uma posição para cima ou para baixo.

§Editar: você pode editar a alternativa selecionada. Se a alternativa já estiver selecionada, clique novamente para editá-la.
Clique para expandir/recolher Referência: Comandos na aba Opções

Você pode usar as opções nesta aba para definir algumas propriedades avançadas para os campos dos formulários de email.

As opções são:

§Descrição do campo: você pode adicionar uma mensagem que explica como preencher o campo. Se você tiver definido um ícone para este campo, o visitante poderá exibir a mensagem passando o cursor do mouse sobre o ícone.

§Atributo <name>: você pode especificar o valor que será dado ao atributo <name> do campo quando o código HTML for gerado para o formulário de email. Esta opção é útil para quando, por exemplo, o método Enviar dados para um arquivo for definido para o Envio dos dados (veja Objeto Formulário de Email | Envio).

§Nome do campo no banco de dados: você pode dar um nome para o campo de modo que os dados enviados sejam reconhecidos corretamente e adicionados no lugar correto no banco de dados. Esta opção é útil, por exemplo, quando o Envio dos dados for definido com o método Enviar dados para um banco de dados (veja Objeto Formulário de Email | Envio).


Objeto Rede Social

Passo 3 - Criação da página >

Objeto Rede Social

 Return to chapter overview
Exibir/Ocultar o texto oculto

Todos nós provavelmente fazemos parte de pelo menos uma rede social: compartilhando mensagens, fotos, vídeos ou algum outro tipo de conteúdo, nós construímos nosso perfil online, criamos relacionamentos e continuamente expandimos nosso círculo de contatos.

Muitas pessoas atualmente interagem online através das redes sociais, então é importante certificar-se que os websites se comunicam corretamente com os diversos perfis sociais que são abertos. O WebSite X5 faz isso através do Objeto Rede Social que tira proveito dos plug-ins fornecidos pelas redes sociais mais comuns: Facebook, Google+, Twitter, Pinterest. Obviamente, o resultado depende dos plug-ins escolhidos mas, falando de forma geral, todos eles têm o objetivo de transformar os visitantes do site em novos contatos nas redes sociais, encorajando assim o compartilhamento do conteúdo.

Clique para expandir/recolher Referência: As redes sociais que estão disponíveis

Em primeiro lugar, você precisa selecionar um item para ser adicionado a partir da lista Rede Social. Os itens disponíveis são:

§AddThis - Botões de 'Compartilhar': esta opção adiciona uma barra de botões e/ou um menu que o visitante pode usar para selecionar uma rede social na qual ele queira compartilhar seu conteúdo com seus contatos.

Para maiores informações sobre como o plug-in AddThis funciona, visite http://www.addthis.com/social-plugins

§Facebook - Caixa de comentários: esta opção adiciona área do Facebook, onde os visitantes podem deixar comentários.

§Facebook - Caixa de 'Curtir': esta opção insere uma caixa onde os visitantes podem ler as postagens mais recentes do mural no Facebook e clicar no botão "Curtir" para seguir.

§Facebook - Botão de 'Curtir': esta opção insere o botão "Curtir", de modo que os visitantes possam clicar nele e compartilhar o conteúdo que gostaram com seus amigos no Facebook.

Para maiores informações sobre como os plug-ins do Facebook funcionam, visite https://developers.facebook.com/docs/plugins/

§Google Plus - Botão '+ 1': esta opção adiciona o botão "Seguir": os visitantes que clicarem aqui podem recomendar o conteúdo que gostarem e quiserem compartilhar no Google+ através da Pesquisa do Google

§Google Plus - Badge (Caixa de fãs): esta opção adiciona um emblema e os visitantes podem ler o perfil de uma pessoa no Google+ e seguir aquela pessoa.

§Google Plus - Ícone: esta opção adiciona um botão para que os visitantes possam ler o perfil de uma pessoa no on Google+ e seguir aquela pessoa.

Para maiores informações sobre como funcionam os plug-ins do the Google+, visite https://developers.google.com/+/plugins/

§Twitter - Botão 'Tweet': esta opção adiciona o botão "Tweet": se os visitantes clicarem nele, eles poderão compartilhar o site com seus seguidores no Twitter.

§Twitter - Caixa de Conta: esta opção adiciona uma caixa onde os visitantes podem ler os tweets mais recentes de uma conta no Twitter e participar da discussão.

§Twitter - Botão 'Seguir': esta opção adiciona o botão "seguir": os visitantes clicam nele para seguir uma conta no Twitter.

Para maiores informações sobre como os plug-ins do Twitter funcionam, visite https://dev.twitter.com/docs/twitter-for-websites

§Pinterest - Botão 'Seguir': esta opção adiciona o botão "Seguir": quando os visitantes clicarem nele, eles podem seguir uma conta no Pinterest.

§Pinterest - Botão 'Pinar': esta opção adiciona o botão "Pinar": quando os visitantes clicarem nele, eles compartilham o conteúdo que gostaram no Pinterest.

Para maiores informações sobre os plug-ins do Pinterest, veja http://pinterest.com/about/goodies/
Clique para expandir/recolher Referência: Configurações disponíveis

Obviamente, para cada item selecionado na lista Rede Social, há Configurações específicas disponíveis, com as quais você pode definir como cada uma irá funcionar. Além das opções relacionadas especificamente ao estilo, você precisa prestar uma atenção especial aos seguintes parâmetros:

AddThis - Botões de 'Compartilhar'

§Nome de usuário: este é o nome de usuário que você recebe quando abre uma conta no AddThis. Administradores de sites com uma conta no AddThis devem especificar seu papel para poderem consultar estatísticas sobre como os visitantes usam o serviço em seu website.

Facebook - Caixa de comentários

§Endereço do site (URL): este parâmetro especifica a URL do site sobre o qual os visitantes farão comentários. Normalmente a caixa "Comentários" é adicionada à página do website sobre o qual os visitantes farão comentários: neste caso, a URL deverá corresponder à página que contém a caixa "Comentários".

Facebook - Caixa de 'Curtir'

§URL do Perfil: este parâmetro especifica a URL da página no Facebook para a qual será criado o link, para poder exibir o conteúdo e possibilitar que os visitantes sigam a página, ao clicarem no botão "Curtir".

Facebook - Botão de 'Curtir'

§Endereço do site (URL): este parâmetro especifica a URL do site que os visitantes avaliarão, ao clicar no botão "Curtir".

Google Plus - Botão '+ 1'

§Endereço do site (URL): este parâmetro especifica a URL do site que os visitantes poderão recomendar aos seus contatos.

Google Plus - Badge (Caixa de fãs) / Google Plus - Ícone

§URL do Perfil: este parâmetro fornece a URL do perfil no Google+ que será vinculado para que os visitantes possam segui-lo.

Twitter - Botão 'Tweet'

§Endereço do site (URL): este parâmetro fornece a URL do site que os visitantes podem postar nos seus perfis no Twitter.

Twitter - Caixa de Conta / Twitter - Botão 'Seguir'

§Nome de usuário: é o nome de usuário do perfil no Twitter.

Pinterest - Botão 'Seguir'

§Nome de usuário: é o nome de usuário para o perfil no Pinterest.

Pinterest - Botão 'Pinar'

§Endereço do site (URL): é o parâmetro que fornece a URL do site que é a fonte das fotos que os visitantes podem pinar nos seus Painéis no Pinterest.

§URL da imagem: este parâmetro fornece a URL da foto que os visitantes podem pinar em seus Painéis no Pinterest.

Observações sobre compatibilidade com as versões anteriores:

Na versão 9, este objeto ficava disponível como widget em Objeto HTML e Widgets.


Objeto Livro de Visitas

Passo 3 - Criação da página >

Objeto Livro de Visitas

 Return to chapter overview
Exibir/Ocultar o texto oculto

O Livro de Visitas permite que os visitantes do site deixem sua assinatura ou um comentário e/ou votem. Ele se consiste de um formulário curto que os visitantes preenchem, e uma lista de comentários já feitos por outros visitantes.

WebSite X5 permite que você personalize o Livro de Visitas e gerencie a publicação dos comentários usando um Painel de Controle específico online.

Clique para expandir/recolher Referência: Configurações do Livro de Visitas

Para criar um Livro de Visitas, você precisa definir o Tipo de conteúdo que os visitantes podem deixar, escolhendo entre:

Comentar e Votar: os visitantes podem escrever um comentário e votar no website.

Comentar: os visitantes podem escrever um comentário, mas não podem votar.

Votar: os visitantes podem votar, mas não podem escrever um comentário.

Você pode escolher opções para as Configurações dos comentários, dependendo do Tipo de conteúdo que tiver selecionado:

§Modo de visualização: você pode decidir se os comentários feitos pelos visitantes serão publicados imediatamente ou se devem ser aprovados antes, usando os comandos no painel de controle online.

§Ordenar por: você pode definir a ordem cronológica dos comentários publicados, a partir do mais recente para o mais antigo, ou vice-versa.

§Exibir botão 'Abuso': selecione esta opção se desejar que seja adicionado um botão "Abuso", para que os visitantes possam denunciar conduta questionável.

§Ativar filtro 'Captcha' anti-spam: você pode adicionar o filtro Captcha anti-spam no final do formulário de comentário. Uma série de letras distorcidas é exibida em ordem aleatória e os visitantes devem copiá-las corretamente no campo fornecido para poderem enviar seu comentário.

§Estilo de votação: selecione esta opção para definir o estilo do elemento que os visitantes podem votar (por exemplo, 5 estrelas). Esta é a única opção disponível se você selecionar Votar como Tipo de conteúdo.

As seguintes Propriedades podem ser definidas para cada Tipo de conteúdo:

§Altura: você pode definir a altura em pixels do Objeto Livro de Visitas. Cada vez que um visitante deixar um comentário e ele for publicado no site, o comentário é adicionado à lista dos já existentes: você pode definir a altura do objeto de modo que, após um determinado número de comentários, a lista pode ser deslocada com barras de rolagem para permitir a visualização de todo o conteúdo.
Clique para expandir/recolher Referência: Enviando dados para o Livro de Visitas

Você pode indicar como os dados enviados no formulário de comentários serão gravados e manipulados pelo administrador do website na seção Modo de salvar os dados:

§Subpasta no Servidor onde salvar os dados: especifique a pasta no servidor (que tenha permissão de escrita PHP) onde os dados enviados devem ser gravados. O nome da pasta no servidor principal é especificado pela opção Pasta no servidor com permissão para escrita na janela Gerenciamento de Dados . Se você não especificar uma sub-pasta, os dados serão gravados nesta pasta.

§Enviar um email para avisar que o comentário foi recebido.: será enviado um aviso por email quando novos dados chegarem.

§Email do usuário: Você deve definir alguns parâmetros para cada opção de envio:

insira o endereço do destinatário que irá receber os emails de aviso de recebimento de dados.

Os provedores normalmente dão permissão de escrita a todas as pastas no servidor: se este for seu caso, você não precisará fornecer o endereço relativo da pasta pública. Em todos os outros casos, entre em contato com seu provedor de hospedagem para obter o endereço relativo completo da pasta pública.

Você pode verificar na aba WebSite Test do painel de controle online se a pasta com permissão de escrita e quaisquer sub-pastas dentro dela de fato existem e, se existirem, se você tem permissão de escrita nelas (para poder salvar os dados).

A página que contém o Objeto Livro de Visitas deverá ser salva no formato .PHP, para que o Livro de Visitas possa funcionar corretamente.

Use a opção Extensão do arquivo na janela Propriedades da Página | Avançadas para definir formatos da página.

Observações sobre compatibilidade com as versões anteriores:

Na versão 9, este objeto ficava disponível como widget em Objeto HTML e Widgets.

Melhores práticas:

-

Como gerenciar os comentários no Blog e no Livro de Visitas a partir do Painel de Controle Online

Further information:

-

Painel de Controle Online


Objeto Mapa

Passo 3 - Criação da página >

Objeto Mapa

 Return to chapter overview
Exibir/Ocultar o texto oculto

Websites comerciais normalmente têm uma página de contato, e a maioria agora inclui um mapa interativo que mostra a localização geográfica da empresa. Esses mapas são úteis porque dão aos consumidores em potencial uma idéia melhor do endereço da empresa e indicam como chegar até ela.

WebSite X5 permite que você adicione um mapa ao seu site, usando o serviço do Google Maps™, através do Objeto Mapa.

Clique para expandir/recolher Referência: Configurações para um mapa interativo

As Configurações que você precisa definir para criar um mapa interativo são:

§Endereço: é o endereço a ser destacado no mapa.

§Estilo: esta configuração especifica como o mapa deverá ser visualizado: Mapa, Satélite ou Earth.

§Idioma: esta configuração define o idioma a ser usado no mapa.

§Tamanho: esta configuração define o tamanho do mapa. Deixe o Manter proporções selecionado para manter a proporção entre a largura e a altura.

Observações sobre compatibilidade com as versões anteriores:

Na versão 9, este objeto ficava disponível como widget em Objeto HTML e Widgets.


Objeto Animação Flash

Passo 3 - Criação da página >

Objeto Animação Flash

 Return to chapter overview
Exibir/Ocultar o texto oculto

WebSite X5 permite que você adicione diversos tipos de animações e efeitos especiais às suas páginas, de modo que você possa torná-las mais atraentes e interessantes.

Você pode importar todo tipo de animação em Flash (no formato .SWF), desde simples banners com texto e imagens até vídeo clipes mais complexos e interativos. Eles tanto podem ser importados do seu próprio computador ou extraídos da Internet. Você pode usar os recursos avançados disponíveis para anexar quaisquer arquivos que sejam necessários para que a animação funcione corretamente.

Os comandos para se criar um Objeto Animação Flash estão organizados nas abas Básicas e Avançadas.

Clique para expandir/recolher Referência: Comandos na aba Básicas

Use os comandos nesta aba para importar os arquivos que precisar para criar o Objeto Animação Flash.

O arquivo de animação Flash pode ser importado do seu computador ou da Internet. Se ele estiver no seu computador, selecione a opção Arquivo local, clique no botão [image] para procurar pelo arquivo (no formato .SWF). No segundo caso, selecione a opção Arquivo na internet e insira o endereço de onde o arquivo que você quer está localizado na Internet.

Selecione a opção Pré-visualizar para dar uma olhada prévia da animação importada na janela de pré-visualização.

Você precisará instalar o Adobe® Flash® player para conseguir visualizar o arquivo. Ele pode ser baixado em http://get.adobe.com/br/flashplayer/otherversions/ (escolha a opção "Outros navegadores" (Other browsers).

Você pode definir as seguintes Propriedades para a animação que você inseriu:

§Texto alternativo: é o texto que será exibido se, por algum motivo, a animação não puder ser executada.

§Tamanho: esta configuração fornece a largura e a altura em pixels da animação Flash. A largura máxima possível é indicada entre parênteses, e depende de como a tabela de layout de página foi definida. Deixe o Manter proporções selecionado para manter a proporção entre a largura e a altura.

§Versão do player: indica qual versão do Flash player é necessária para executar a animação inserida. Se o visitante não tiver a versão correta, será exibida automaticamente uma mensagem solicitando que ele faça uma atualização.

§Fundo transparente: se esta opção for selecionada, o plano de fundo da animação fica transparente.
Clique para expandir/recolher Referência: Comandos na aba Avançadas

Você pode usar os comandos nesta aba para importar quaisquer arquivos que sejam necessários para o funcionamento correto da animação Flash.

Todos os arquivos que estiverem vinculados à animação Flash importada são listados em uma tabela que fornece o nome do arquivo e o Endereço relativo no servidor.

Use os comandos a seguir para criar a lista de arquivos vinculados à animação Flash:

§Adicionar...: este comando abre a janela Carregar arquivo vinculado, onde você pode adicionar um novo arquivo vinculado à animação Flash.

§Editar...: este comando abre a janela Carregar arquivo vinculado, onde você pode alterar as configurações para o arquivo selecionado na tabela.

§Remover: este comando remove da lista o arquivo selecionado.

Finally, you can use this option:

§Endereço relativo para a publicação do arquivo em Flash: para especificar o endereço relativo da pasta onde o arquivo .SWF vinculado à animação Flash deverá ser publicado.


Objeto Lista de Produtos

Passo 3 - Criação da página >

Objeto Lista de Produtos

 Return to chapter overview
Exibir/Ocultar o texto oculto

Um dos recursos mais interessantes no WebSite X5 é a possibilidade de uma Loja Virtual: você pode criar lojas online para exibir seus produtos em uma vitrine virtual que fica aberta para o mundo, e vender para todos diretamente online.

Além de adicionar produtos e gerenciar o carrinho de compras virtual, você também pode criar catálogos online com o objeto Lista de Produtos do WebSite X5. Os consumidores podem percorrer o conteúdo, ler uma descrição para cada artigo nas fichas dos produtos e comprar o artigo em que estiverem interessados.

Os comandos para criar um objeto Lista de Produtos ficam disponíveis nas abas Lista e Configurações.

Clique para expandir/recolher Referência: Comandos na aba Lista

Use os comandos nesta aba para especificar quais produtos devem aparecer no objeto Lista de Produtos.

A coluna no lado esquerdo da janela mostra a Lista de Categorias e Produtos inseridos quando o Carrinho de compras foi criado no Passo 4 - Configurações Avançadas.

Há uma caixa de seleção ao lado de cada categoria e produto: clique nas caixas de seleção para adicionar categorias/produtos à Lista de Produtos que estiver criando. Todos os produtos selecionados são exibidos na coluna no lado direito da janela.

Selecionar uma categoria ou selecionar todos os produtos em uma categoria não é a mesma coisa: somente no primeiro caso é que se mais tarde novos produtos forem adicionados a uma categoria já existente na Lista de Produtos é que eles também serão adicionados automaticamente à mesma Lista de Produtos.

Você pode decidir como quer que os produtos na coluna à direita devem ser ordenados: clique no botão Ordenação e escolha Personalizado, Nome, Categoria, Preço, Ascendente or Descendente.

Se você escolher Personalizado você poderá usar os botãoes Para cima / Para baixo para organizar os produtos como deseja que eles apareçam.

Clique para expandir/recolher Referência: Comandos na aba Configurações

Os comandos nesta aba permitem que você defina o estilo das fichas dos produtos que descrevem os produtos na lista.

Em primeiro lugar, você deve indicar o Modo de exibição para as fichas de produtos:

Somente texto

A ficha do produto exibe somente o nome, descrição, uma lista suspensa com variações (se houverem), preço, quantidade e o botão "Comprar".

Imagem e texto

A ficha do produto tem uma foto do produto à esquerda e todas as informações sobre o produto à direita.

Texto e imagem

A ficha do produto tem uma foto do produto à direita e todas as informações sobre o produto à esquerda.

Somente imagem

Todas as informações sobre o produto são fornecidas abaixo da foto. A descrição detalhada não é incluída.

Alternar imagem e texto

As fichas dos produtos alternam entre foto à esquerda / texto à direita com foto à direita / texto à esquerda.

Você pode usar as opções em Configurações das molduras para definir:

§Quadros por linha: quantas fichas de produtos em uma única linha.

§Altura do quadro: a altura em pixels das fichas de produtos. As fotos dos produtos serão redimensionadas automaticamente de acordo com a altura fornecida. Se as descrições dos produtos forem longas demais para serem exibidas por completo, será adicionada uma barra de rolagem.

§Largura da imagem (%): quanto do espaço é ocupado pela foto e quanto pelo texto, se tiver escolhido um layout com a foto e o texto lado a lado. Por exemplo, se a foto ocupa 30% do espaço, os 70% remanescentes são ocupados pelo texto.

§Margem interna: qual deverá ser a largura da margem (a margem é o espaço entre a borda da ficha do produco e seu conteúdo).

Você pode usar as opções em Cores para definir:

§Cor do texto/Cor do fundo: as cores que serão usadas no texto e no plano de fundo das fichas dos produtos.

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

Você pode usar estas Opções para definir:

§Espessura: a espessura das bordas (cada uma pode ser definida individualmente).

§Cor: a cor das bordas (novamente, cada borda pode ser colorida individualmente).

§Cantos arredondados: o grau de arrendondamento dos cantos (cada um pode ser definido individualmente).

§Sombra: uma sombra, especificando sua cor, posição, difusão e tamanho.

Você pode usar estas Opções para definir as seguintes configurações:

§Exibir preço: exibe o preço do produto, com ou sem impostos, na ficha do produto.

§Exibir campo 'Quantidade': exibe um campo de quantidade na ficha do produto para que o consumidor possa indicar quantos itens de um produto ele deseja adicionar ao seu carrinho de compras.

§Habilitar Link sobre a imagem: cria um link nas fotos das fichas de produto para suas versões ampliadas, que serão exibidas na ShowBox.

Você pode personalizar o estilo da Showbox: use as opções na seção Estilos e Modelos | Email do Passo 4 - Configurações Avançadas , você pode definir cores, sombras, opacidade, efeitos de entrada, etc.

Para o objeto Lista de Produtos funcionar corretamente, você deve já ter adicionado produtos ao carrinho de compras, usando os comandos na aba Carrinho de compras no Passo 4 - Configurações Avançadas.


Objeto HTML e Widgets

Passo 3 - Criação da página >

Objeto HTML e Widgets

 Return to chapter overview
Exibir/Ocultar o texto oculto

WebSite X5 fornece um objeto específico para cada tipo de conteúdo que você deseje adicionar a uma página: texto, fotos, animações, formulários de email, etc. E com o objeto Objeto HTML e Widgets, as possibilidades são praticamente ilimitadas. Com este objeto, você pode adicionar código HTML diretemente na página e assim incluir recursos que de outro modo teria sido impossível.

Widgets são particularmente úteis: eles são programas curtos, prontos para usar, que desempenham uma função específica. Um bom exemplo de um widget é o Google News™: você só precisa configurar alguns parâmetros para adicionar uma caixa com as notícias mais recentes, atualizadas em tempo real.

Os comandos para se criar um Objeto HTML e Widgets estão organizados nas abas Cógigo HTML e Avançadas.

Clique para expandir/recolher Referência: Comandos na aba Cógigo HTML

Nesta aba você tem um editor para incluir o código HTML que deseja adiconar a uma página. Você tanto pode digitar o código ou dar um duplo clique em um dos widgets disponíveis.

O editor na caixa Código HTML inclui os seguintes comandos:

Cortar [CTRL+X] - Copiar [CTRL+C] - Colar [CTRL+V]

Estes comandos cortam, copiam e colam o trecho de código selecionado.

Desfazer [CTRL+Z] - Refazer [ALT+CAPS+BACKSPACE]

Estes comandos desfazem/refazem a última operação.

Destaque da sintaxe foi introduzido no editor de HTML para facilitar a leitura/criação do código. Certas partes do código são exibidas em diferentes cores, sem alterar o significado do texto. Desta forma, fica mais fácil ler o código e encontrar erros.

A Lista de Widgets exibe uma lista com todos os widgets disponíveis. Dê um duplo clique em um widget para abrir a janela Widget onde você poderá definir diversos parâmetros. Quando você confirmar o código HTML para o widget, ele é composto e automaticamente adicionado ao editor.

Observações sobre compatibilidade com as versões anteriores:

Objetos disponíveis - Na versão 9, os botões Livro de Visitas, Redes Sociais e Mapa ficavam disponíveis como widgets: na versão 10 eles agora são Objetos (veja em Passo 3 - Criação da página).

As seguintes opções estão disponíveis em Propriedades:

§Largura: confere a largura do Objeto HTML e Widgets; ela é definida automaticamente de acordo com o espaço disponível na tabela de layout de página.

§Altura: esta opção define a altura do Objeto HTML e Widgets.

§Exibir barras de rolagem: esta opção fica ativa por padrão: uma barra de rolagem é adicionada automaticamente se o Objeto HTML e Widgets for maior que o valor definido na opção Altura.
Clique para expandir/recolher Referência: Comandos na aba Avançadas

Use os comandos nesta aba para criar uma folha de estilo (.CSS) e/ou criar a lista de arquivos para anexar ao Objeto HTML e Widgets no qual estiver trabalhando.

Use o editor na caixa Código CSS para inserir o código da folha de estilo (o editor é idêntico ao usado para o código HTML). O propósito das CSSs é definir o aspecto gráfico das páginas HTML às quais são vinculadas.

A tabela Arquivos vinculados ao código HTML fornece os nomes de todos os arquivos vinculados e seu Endereço relativo no servidor.

Você pode usar os seguintes comandos para criar a lista de arquivos vinculados ao código HTML:

§Adicionar...: você pode adicionar um novo arquivo à lista, na janela Carregar arquivo vinculado.

§Editar...: abre a janela Carregar arquivo vinculado, Onde você pode alterar as configurações para o arquivo selecionado na tabela de arquivos vinculados.

§Remover: você pode remover da tabela de arquivos vinculados o arquivo selecionado.


Editor de imagens

Passo 3 - Criação da página > Recursos em comum >

Editor de imagens

 Return to chapter overview
Exibir/Ocultar o texto oculto

Além de otimizar as imagens importadas, o WebSite X5 também fornece um editor de imagens interno versátil para adicionar toques finais às fotos.

O Editor de imagens pode ser aberto pressionando-se o botão Editar..., que normalmente é encontrado em janelas onde os arquivos de imagem podem ser encontrados, como Objeto Imagem, Objeto Galeria e Carrinho de compras.

O Editor de imagens é organizado com seguintes abas: Cortar e girar, Filtros, Marca d'água, Máscara, Moldura, Efeitos e Biblioteca.

O Editor de imagens também tem os seguintes botões:

§Ok: este botão fecha o Editor de imagens e o leva de volta à janela principal, salvando quaisquer mudanças que você possa ter efetuado.

§Cancelar: este botão fecha o Editor de imagens e o leva de volta à janela principal, sem salvar as alterações.

§Salvar como...: este botão salva uma cópia da foto original no formato .PNG.

Clique para expandir/recolher Referência: Comandos na aba Cortar e girar

Você pode usar os comandos nessa aba para definir qual parte da foto você deseja exibir e remover o restante.

Você pode marcar a área que deseja manter (a caixa de recorte) na pré-visualização da foto e usar as âncoras para alterar o tamanho. Você também pode mover a caixa de recorte para trazer um detalhe para o primeiro plano: clique nela, mantenha o botão esquerdo do mouse pressionado, e arraste a caixa para a nova posição.

Você não precisa confirmar o recorte: a área do lado de fora da caixa de recorte (mais escura que o original) não será exibida. Se você mudar de idéia e quiser desfazer a caixa de recorte, basta clicar fora da caixa para removê-la e cancelar sua seleção.

As opções a seguir são exibidas na janela, ao lado da foto:

§Recortar: esta opção mostra os valores (em pixels) da Coord. X e da Coord. Y que correspondem ao canto esquerdo superior da área selecionada. Ele também informa a Largura e a Altura da área. Você pode alterar o tamanho da área selecionada mudando os valores exibidos aqui (como uma alternativa a puxar as âncoras da caixa de recorte).

§Inverter: você pode inverter a foto horizontal ou verticalmente.

§Rotação: você pode girar a foto no sentido horário em 0°, 90°, 180° ou 270°.
Clique para expandir/recolher Referência: Comandos na aba Filtros

Você pode usar as opções nesta aba para corrigir a cor e adicionar filtros gráficos à foto importada.

Se quiser aplicar um filtro, selecione um na lista, ative-o e defina as configurações. As alterações feitas aos filtros são aplicadas imediatamente e exibidas na pré-visualização da foto.

§Filtros: esta opção lista os filtros disponíveis. A lista inclui Brilho/Contraste, RGB, Intensidade (HSL), Refinar, Desfocado, Preto e branco, Sépia, Mosaico, Retrato, Difusão, Pintura a Óleo, Textura de Tela, Ruído, Marmorizado. Clique em um dos filtros para aplicá-lo à imagem: sua caixa de seleção ficará marcada.

§Configurações: você pode alterar as configurações para o filtro selecionado.
Clique para expandir/recolher Referência: Comandos na aba Marca d'água

Você pode usar os comandos nesta aba para aplicar uma marca d'água à imagem importada, para protegê-la contra cópias não autorizadas. A marca d'água altera a foto, às vezes fornecendo informações sobre direitos autorais, desencorajando assim as pessoas de copiarem ou usarem a imagem de outras formas.

§Marca d'água: esta opção lista as diversas marcas d'água que você pode aplicar à imagem. Você também pode aplicar uma marca d'água personalizada: selecione a segunda opção na lista (Personalizada...) e importe o arquivo de imagem que tiver preparado.

§Configurações: você pode girar a marca d'água em 90°, 180° ou 270° ou invertê-la horizontal/verticalmente.

Uma marca d'água deve ser um arquivo de imagem .GIF, .PNG, .PSD ou .WMF, configurado com transparência. A marca d'água é aplicada sobre a foto original, de modo que somente a parte que corersponde às áreas transparentes da marca d'água poderão ser vistas.

O formato .GIF só consegue tratar um nível de transparência, enquanto os formatos .PNG e .PSD conseguem tratar até 256, então seria melhor salvar sua marca d'água em um desses dois formatos.

+

=

Clique para expandir/recolher Referência: Comandos na aba Máscara

Você pode usar os comandos nesta aba para aplicar uma máscara às imagens importadas, para alterar sua aparência.

§Máscara: este comando lista as diversas máscaras que você pode aplicar à sua imagem. Você também pode aplicar uma máscara personalizada: selecione a segunda opção na lista Personalizada... e importe o arquivo de imagem que você preparou.

§Configurações: você pode girar a máscara aplicada em 90°, 180° ou 270° ou invertê-la horizontal/verticalmente.

Uma máscara é basicamente uma imagem em 256-cores com vários tons de cinza: uma máscara é aplicada sobre a foto original de modo que as partes em preto ficam invisíveis, e as partes em branco permanecem visíveis.

+

=

Clique para expandir/recolher Referência: Comandos na aba Moldura

Você pode usar os comandos nesta aba para aplicar uma moldura à foto importada.

§Moldura: este comando lista as molduras que você pode aplicar à sua foto. Você também pode aplicar sua própria moldura: selecione a segunda opção na lista (Personalizada...) e importe o arquivo de imagem que tiver preparado e que contenha a moldura personalizada.

§Configurações: você pode girar a moldura em 90°, 180° ou 270° ou invertê-la horizontal/verticalmente.

Uma moldura deve ser um arquivo de imagem no formato .GIF, .PNG, .PSD ou .WMF, configurado com transparência: a moldura é aplicada sobre a foto original, de modo que somente as partes que corresponderem às áreas de transparência da moldura é que ficarão visíveis.

O formato .GIF só consegue tratar um nível de transparência, enquanto os formatos .PNG e .PSD conseguem tratar até 256, então seria melhor salvar sua marca d'água em um desses dois formatos.

+

=

Clique para expandir/recolher Referência: Comandos na aba Efeitos

Você pode usar os comandos nesta aba para aplicar um efeito gráfico especial à foto importada.

§Efeitos: este comando lista os efeitos que você pode aplicar à foto. Eles são Sombra, Reflexo, Brilho externo, Borda colorida, Gradiente, Chanfrado, Borda Chanfrada, Moldura, Rotação, Perspectiva, Distorcer e Opacidade. Clique no efeito que deseja aplicar (sua caixa de seleção ficará marcada).

§Configurações: você pode alterar as configurações para o efeito escolhido.
Clique para expandir/recolher Referência: Comandos na aba Biblioteca

Você pode usar os comandos nesta aba para aplicar uma folha de estilo à foto atual, ou pode salvar as configurações para esta foto em uma nova folha de estilo que poderá então ser aplicada a outras fotos.

§Aplicar: este comando aplica a folha de estilo selecionada à foto atual.

§Adicionar: este comando salva as configurações definidas até o momento nas abas do Editor de imagens para a foto atual e criam uma nova folha de estilo com elas. A nova folha de estilo é adicionada à lista Personalizar.

§Remover: este comando remove a folha de estilo selecionada entre as folhas de estilo Personalizar. Você não pode remover as folhas de estilo Pré-definidas.


Estilo da célula

Passo 3 - Criação da página > Recursos em comum >

Estilo da célula

 Return to chapter overview
Exibir/Ocultar o texto oculto

WebSite X5 torna mais fácil criar páginas no seu site dividindo o espaço em células na tabela de layout de página. O número de células depende de quantas linhas e colunas houverem na tabela. Para criar uma página (e adicionar conteúdo a ela), tudo o que você tem que fazer é arrastar e soltar objetos nas células (um objeto por célula).

Uma célula é uma área definida na página: tem seu próprio conteúdo e seu próprio estilo. Você pode definir as margens, bordas e plano de fundo de uma célula de modo que seja dado o destaque devido ao conteúdo da página.

Para definir o estilo de uma célula, selecione e clique no botão [image] para abrir a janela Estilo da célula. As opções nesta janela são divididas entre as abas Estilo, Texto e Biblioteca.

Clique para expandir/recolher Referência: Comandos na aba Estilo

Você pode usar os comandos nesta aba para definir o estilo da célula atual na tabela de layout de página.

Em primeiro lugar, você precisa escolher o tipo de Fundo que deseja para a célula, e você pode escolher entre:

Fundo colorido: o fundo é preenchido com uma cor sólida.

Gradiente do fundo: o fundo é preenchido com uma cor sombreada e você pode definir as cores inicial e final, e a direção do sombreamento.

Imagem de fundo: uma imagem é usada como fundo da célula.

Ajustar imagem à célula: a imagem de fundo é recortada e encaixada com o tamanho exato da célula (veja Como trabalhar no estilo da célula)

Você agora pode especificar as Configurações para cada estilo de fundo.

 | Fundo colorido | Gradiente do fundo | Imagem de fundo | Ajustar imagem à célula
§Cor do fundo: especifica a cor que será usada para preencher o fundo. | P | - | P | P
§Cor inicial / Cor final: especifica a cor inicial e final do sombreamento. | - | P | - | -
§Difusão: indica se a cor inicial ou final é que é a mais importante, definindo o espaço (em pixels) no qual a transposição da cor inicial para a final deverá ocorrer. Por exemplo, um sombreamento vertical que passe do cinza para o branco, irá desvanecer gradualmente do cinza para o branco nos primeiros 250 pixels, e depois disso o fundo ficará completamente branco. | - | P | - | -
§Direção: você pode escolher em qual direção o fundo deverá ser sombreado, a começando Em cima, Embaixo, Esquerda ou Direita. | - | P | - | -
§Arquivo de imagem: indica o arquivo (.JPG, .GIF, .PNG.) da imagem a ser usada como plano de fundo. | - | - | P | P
§Repetir: indica se a imagem do plano de fundo da página deverá ser repetida ou não. Ela pode ser repetido horizontal, verticalmente ou em ambas direções (ladrilho) para ocupar todo o espaço disponível. A imagem do plano de fundo também pode ser redimensionada para se ajustar ao espaço disponível. | - | - | P | -
§Alinhamento: você pode especificar como a imagem de fundo deverá ser alinhada à área dentro da célula. | - | - | P | -
§Saturação da cor: você pode alterar a tonalidade da imagem de fundo: um efeito de "colorização" é aplicado à imagem para que ela adquira o tom da cor que você deseja. | - | - | P | -
§Largura do bloco / Altura do bloco: você pode configurar o tamanho de partes da imagem que serão cortados, de modo que você pode indicar quais partes da imagem permanecerão fixas, e quais devem ser repetidas (veja Como trabalhar no estilo da célula). | - | - | - | P
§Opacidade: você pode definir a quantidade de transparência da cor/sombra da imagem de fundo, permitindo que o fundo da página apareça através dela. | P | P | P | P

Você pode usar as opções na aba Bordas personalizadas para definir:

§Espessura: a espessura das bordas (cada uma pode ser definida individualmente).

§Cor: a cor das bordas (novamente, cada borda pode ser colorida individualmente).

§Cantos arredondados: o grau de arrendondamento dos cantos (cada um pode ser definido individualmente).

§Sombra: uma sombra, especificando sua cor, posição, difusão e tamanho.

Finalmente, você pode usar as opções em Alinhamento e Margem para definir o seguinte:

§Alinhamento: esta opção alinha o objeto no Alto/Centro/embaixo e Esquerda/Centro/Direita da célula atual.

§Margem externa / Margem interna: estas opções configuram o valor em pixels das margens interna e externa da célula atual (veja O Box Model no WebSite X5).

Observações sobre compatibilidade com as versões anteriores:

Nas versões anteriores, as opções para margens de células e alinhamento do conteúdo da célula eram localizadas nos menus exibidos pelos botões [image] e [image] na barra de ferramentas acima da tabela de layout de página. Na versão 10, estes botões foram removidos, e as opções agora estão na janela Estilo da célula| Estilo .
Clique para expandir/recolher Referência: Comandos na aba Texto

Use os comandos nesta aba para adicionar e definir o estilo do texto que completa o estilo da célula atual na tabela de layout de página.

Em primeiro lugar, você precisa selecionar o elemento - texto ou imagem - que você deseja adicionar e no qual irá trabalhar. Você pode escolher entre:

Título: é o texto que será exibido como título da célula atual.

Imagem do cabeçalho: é a imagem que será incluída no cabeçalho da célula atual, ao lado do Título.

Descrição: é o texto que será exibido como legenda, no rodapé da célula atual.

Uma vez que tenham sido adicionados, você pode selecionar os diversos elementos clicando diretamente na pré-visualização ou selecionando-os na lista suspensa.

Existem diversas opções na aba Configurações, dependendo do tipo de elemento que tiver selecionado:

Estas opções estão disponíveis para o Título e a Descrição:

§Conteúdo: insira o texto para o título ou para a descrição da célula.

§Cor do fundo / Cor do texto: você pode especificar a cor do texto e para o plano de fundo do texto em que estiver trabalhando.

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Alinhamento: você pode especificar como o texto deverá ser alinhado na célula: à Esquerda, no Centro ou à Direita.

§Margem externa / Margem interna: você pode especificar o valor em pixels para as margens do texto, de modo que fique posicionado da distância exata das bordas da célula, como você quer.

As opções a seguir estão disponíveis para a Imagem do cabeçalho:

§Arquivo de imagem: indica o arquivo (.JPG, .GIF, .PNG.) da imagem a ser usada como plano de fundo.

§Alinhamento: você pode especificar como a imagem deve ser alinhada na célula: à Esquerda, no Centro ou à Direita.

§Margem: você pode especificar o valor em pixels para as margens da imagem, de modo que ela fique posicionada à distância exata que você quer das bordas, e, consequentemente, em reação ao Título.
Clique para expandir/recolher Referência: Comandos na aba Biblioteca

Nesta aba você pode escolher as configurações já existentes, salvas como um Estilo, para aplicar à célula atual, ou você pode salvar as configurações da célula atual como um novo Estilo, para ser usado em outras células.

A Biblioteca lista todos os Estilos Pré-definidas e Personalizar que tenham sido criados. Estes comandos estão disponíveis:

§Aplicar: você pode aplicar as configurações do Estilo selecionado na célula atual.

§Adicionar: você pode salvar as configurações gráficas definidas nas abas Estilo e Texto para a célula atual como um Novo Estilo e adicioná-lo à lista de Estilos em Personalizar.

§Remover: você pode remover o Estilo selecionado da lista de Estilos em Personalizar. Você não pode apagar Estilos em Pré-definidas.

Quando um novo Estilo estiver sendo criado, todas as configurações para a célula atual são mantidas, exceto o conteúdo, que, obviamente, irá variar em cada célula. Por exemplo, a Cor do texto ou Fonte são salvas no novo Estilo, mas não o Conteúdo que tenha sido especificado para elementos como Título ou a Descrição de uma célula.

Melhores práticas:

-

Como trabalhar com o Estilo da célula

Maiores informações:

-

O Box Model no WebSite X5


A janela Link

Passo 3 - Criação da página > Recursos em comum >

A janela Link

 Return to chapter overview
Exibir/Ocultar o texto oculto

Além dos menus de navegação fixos, criados automaticamente pelo Mapa do site, o WebSite X5 permite que você aplique links a textos, fotos e outros elementos. Esses links podem abrir páginas internas/externas, abrir arquivos, exibir imagens, adicionar um produto ao carrinho de compras, e assim por diante.

Quando você aplica um link, você define sua ação, e você também pode definir e personalizar uma Tooltip associada a ele: uma Tooltip explica de forma curta o que acontecerá quando um visitante clicar em um link.

As opções para se configurar um link ficam disponíveis nas abas Ação e Descrição.

Clique para expandir/recolher Referência: Comandos na aba Ação

Você pode usar os comandos nesta seção para indicar a ação a ser associada com o link:

Página do site

Você pode criar um link para uma outra página do site. Clique no botão [image] para ver o Mapa do site e selecionar a Página do site para a qual será criado o link. Se você precisar, também poderá especificar a Âncora interna na página para a qual será criado o link, selecionando uma âncora ou mais de uma lista na página. Você também pode especificar se a página linkada será aberta na mesma janela, em uma nova janela do navegador ou em uma janela popup. No último caso, uma nova janela do navegador será aberta e você poderá configurar a Largura da Tooltip e a Altura.

As Âncoras já devem ter sido previamente associadas a objetos antes que elas possam aparecer na lista Âncora interna na página.

Você pode associar âncoras a objetos clicando no botão [image], no Passo 3 - Criação da página.

Arquivo ou URL

Você pode criar um link para um recurso, um arquivo ou uma página HTML externos, quer estejam no seu computador ou na Internet. Para especificar para qual arquivo você deseja criar o link, selecione a opção Arquivo local e clique no botão [image] para pesquisar e localizar seu arquivo, ou clique na opção Arquivo na internet e digite o endereço de URL que fornece a posição do arquivo na Internet.

Novamente, você pode especificar se o recurso deverá ser aberto na mesma janela, em nova janela do navegador ou em uma janela popup e, neste caso, forneça a Largura da Tooltip e a Altura para ela.

Arquivo ou URL com ShowBox

Você pode criar um link para exibir um arquivo, presente no seu computador ou na Internet, em uma ShowBox. Ao contrário da janela popup, o arquivo na ShowBox é exibido em primeiro plano na página original, a qual é automaticamente sombreada (ficando mais clara ou mais escura).

Para especificar o arquivo para o qual será criado o link, selecione a opção Arquivo local e clique em [image] para procurar o recurso no seu computador, ou selecione a opção Arquivo na internet e digite o endereço de URL que fornece a posição do arquivo na Internet. Use as opções disponíveis para definir a Largura da Tooltip e a Altura da janela ShowBox, e uma Legenda que será exibida logo abaixo.

Links com uma janela ShowBox são úteis para exibir coisas como fotos e documentos em .PDF.

Galeria com ShowBox

Você pode criar um link para exibir uma galeria de fotos dentro de uma janela ShowBox. Para criar a lista de fotos, você pode usar Adicionar..., Remover, Sposta Sopra e Sposta Sotto. Vocè também pode definir o tamanho da janela ShowBox com as opções Largura e Altura).

Você pode personalizar o estilo da Showbox: use as opções na seção Estilos e Modelos | Email do Passo 4 - Configurações Avançadas , você pode definir cores, sombras, opacidade, efeitos de entrada, etc.

Endereço de email

Você pode criar um link para abrir o programa de email padrão e enviar um email. Para configurar um link deste tipo, digite o endereço de email do destinatário, o assunto e o conteúdo da mensagem (opcional).

Se você selecionar Habilitar proteção de endereço de email, o endereço de email especificado será criptografado no código HTML da página, para que não possa ser reconhecido por programas de spyware que buscam endereços de email pela Internet para usar em campanhas de spam.

Chamada via Internet

Você pode criar um link para abrir um programa de chamada telefônica via Internet (por exemplo, o Skype) e conversar com a pessoa indicada no campo específico. Você também pode especificar o Tipo de ação, escolhendo entre Chamar, Adicionar contato, Chat, Mostrar perfil, VoiceMail Skype e Enviar arquivo.

Som

Você pode criar um link para gerar som. Para escolher o arquivo de áudio para o qual será gerado o link, selecione Arquivo local e clique em [image] para pesquisar entre os arquivos do seu computador, ou selecione Arquivo na internet e digite o endereço da URL que localiza o arquivo na Internet. Você pode criar links para arquivos no formato .MP3.

Quando um visitante clicar no link, abre-se uma Tooltip que mostra o botão Play/Pause para começar/parar o arquivo de som. Quando o cursor do mouse é movido para fora da Tooltip, a janela popup é fechada e o som para.

A Tooltip sobre um link de áudio é criada automaticamente pelo Programa: o estilo depende das configurações fornecidas na janela Estilos e Modelos | Texto do Passo 4 - Configurações Avançadas.

Imprimir a página

Você pode criar um link para imprimir a página em exibição.

Mensagem de alerta

Cria um link para uma mensagem de alerta. Para criar um link deste tipo, digite o Texto da mensagem no campo. Se você selecionar Mostrar como janela pop-up, a mensagem de alerta é exibida em uma caixa de diálogo no estilo Windows.

RSS Feed

Você pode exibir o RSS feed do site: o link só fica ativo se um RSS feed tiver sido criado no Passo 4 - Configurações Avançadas.

Quando você testa seu website, aparece uma mensagem para lembrar você que os RSS feeds só serão exibidos quando o website tiver sido publicado na Internet.

Blog

Você pode criar um link para abrir o Blog associado ao seu site. Você já deverá ter criado o Blog no Passo 4 - Configurações Avançadas.

Use as opções para especificar se o Blog para o qual se criou o link deverá ser exibido na mesma janela ou em uma nova janela do navegador que será aberta.

Mapa do site

Você pode criar um link para o Mapa do site, para que seja exibido em uma nova página. Os itens no Mapa, que é criado automaticamente, são links ativos para cada página, então o Mapa é útil para se mover pelo site. Use os controles Expandir todos e Recolher todos para exibir/ocultar os elementos do Mapa.

Ver o carrinho de compras

Você pode usar esta opção para criar um link para a página do carrinho de compras, com uma lista de todos os produtos incluídos até agora.

Adicionar ao carrinho

Você pode criar um link para o carrinho de compras da loja virtual, para que o visitante possa fazer um pedido ou adicionar produtos ao carrinho de compras.

No primeiro caso, selecione Mostrar a Lista de produtos da categoria selecionada e depois a categoria na tabela Categoria de Produtos.

No segundo caso, selecione Adicionar este produto ao carrinho de compras e então escolha um porduto da lista. Você também pode especificar a Opção e a Quantidade do produto que deseja adicionar ao carrinho de compras.

Os links Ver o carrinho de compras e Adicionar ao carrinho só vão funcionar corretamente se você já tiver criado o carrinho de compras na seção Carrinho de compras do Passo 4 - Configurações Avançadas.
Clique para expandir/recolher Referência: Comandos na aba Descrição

Você pode usar as opções nesta aba para adicionar uma descrição ao link. Esta descrição é usada como texto para uma nota explicativa, chamada "Tooltip" (ou simplesmente "tip"). A tip é exibida ao lado do cursor do mouse quando ele se move sobre o link, e deveria explicar o que acontecerá se o visitante clicar no link: "você irá para outra página", "você irá para outro website", "um arquivo será baixado", etc.

Os comandos para escrever uma Tooltip são:

§Texto: digita a descrição do link.

§Arquivo de imagem: adiciona uma imagem que será exibida na Tooltip junto à descrição ou no lugar dela.

§Largura da Tooltip: especifica a largura, em pixels, da Tooltip.

§Largura da imagem (%): especifica a largura da imagem como uma porcentagem da largura da Tooltip.

§Posição da imagem: especifica como a imagem será alinhada com o texto na Tooltip.

Texto, Arquivo de imagem e Largura da Tooltip variam para cada tipo de link, então eles deverão ser definidos a cada vez. Outros estilos gráficos das Tooltips são verdadeiros para todo o projeto, e são definidos na janela Estilos e Modelos | Texto do Passo 4 - Configurações Avançadas.


A janela Propriedades do efeito

Passo 3 - Criação da página > Recursos em comum >

A janela Propriedades do efeito

 Return to chapter overview
Exibir/Ocultar o texto oculto

Nesta janela você pode definir os efeitos de entrada para as fotos em um objeto Apresentação de slides, disponível no editor de Personalização do modelo, para as imagens selecionadas no Objeto Galeria e para as fotos em uma Apresentação de slides da Lista de Produtos (veja Objeto Lista de Produtos).

Os comandos são organizados nas seguintes seções: Tipo de efeito, Zoom e posicionamento e Página.

Clique para expandir/recolher Referência: Comandos na aba Tipo de efeito

Use os comandos nesta aba para escolher o efeito de entrada que será aplicado à foto em que estiver trabalhando:

§Lista de efeitos: uma lista com todos os efeitos disponíveis. Se você selecionar "1 - Aleatório" o efeito que será aplicado às fotos na Apresentação de slides será selecionado em uma ordem aleatória. Quando fizer uma seleção, o efeito na Apresentação de slides é exibido na pré-visualização.

§Tempo de exibição: você pode definir por quantos segundos cada foto será exibida.
Clique para expandir/recolher Referência: Comandos na aba Zoom e posicionamento

Você pode especificar quanto zoom será aplicado e o movimento da foto em que estiver trabalhando.

§Posição inicial: insira a porcentagem de zoom e as coordenadas X e Y a partir de onde a foto inicia o movimento.

§Posição final: insira a porcentagem de zoom e as coordenadas X e Y da posição onde o movimento da foto para.

Em ambos os casos, em vez de especificar as coordenadas X e Y, você pode arrastar a pré-visualização da foto para a posição desejada, definindo assim as posições inicial e final.

Você pode aplicar um efeito de entrada e um efeito de zoom-e-posição para a mesma foto. O efeito de entrada é aplicado primeiro, e a foto é exibida de acordo com as coordenadas e tamanho especificado para a posição inicial. Então a foto é movida e redimensionada até que alcance as coordenadas e tamanho especificados para a posição final.
Clique para expandir/recolher Referência: Comandos na aba Página

Esta seção só fica disponível para fotos em um objeto Apresentação de slides que tenha sido adicionado ao cabeçalho ou rodapé da página (veja Personalização do modelo).

O Mapa do site é aberto: marque as páginas onde quer que a foto em que estiver trabalhando seja exibida. Com esta opção, você pode exibir partes diferentes da mesma Apresentação de slides no cabeçalho/rodapé nas diferentes partes do seu site.

Especificar em que páginas uma determinada foto de uma Apresentação de slides deverá ser exibida pode ser útil quando, por exemplo, você quiser adicionar anúncios. Na Apresentação de slides você pode configurar todos os banners que irá usar no site: com este recurso, você pode garantir que somente as mensagens pertinentes serão exibidas nas páginas ou seções específicas.


A janela Carregar arquivo vinculado

Passo 3 - Criação da página > Recursos em comum >

A janela Carregar arquivo vinculado

 Return to chapter overview

Esta janela se abre quando você clica no botão Adicionar... na lista de arquivos vinculados a uma animação Flash (veja Objeto Animação Flash | Avançadas) ou ao código HTML (veja Objeto HTML e Widgets | Avançadas).

Os comandos disponíveis são:

§Vincular arquivo que será exportado para o servidor: você pode selecionar um arquivo a ser importado, porque ele é vinculado ao objeto em que estiver trabalhando.

§Endereço relativo no servidor: insira o endereço relativo da pasta a partir de onde o arquivo (vinculado ao objeto) deverá ser importado.

§Vincular arquivo à página (somente para arquivos .js e .css): se o arquivo importado for um JavaScript (no formato .JS) ou uma folha de estilo (no formato .CSS), ele deverá estar vinculado ao código da página para funcionar corretamente. Quando selecionar esta opção, o código necessário é adicionado automaticamente à seção <HEAD> do código HTML da página.


Configurações Avançadas

Passo 4 - Configurações Avançadas >

Configurações Avançadas

 Return to chapter overview

Quando tiver criado o Mapa do site no Passo 2 e as diversas páginas e seu conteúdo no Passo 3, você poderá prosseguir para o Passo 4, onde poderá escolher entre diversos recursos avançados e aperfeiçoar seu site. Você poderá personalizar a aparência dos menus e do texto, e também poderá adicionar muitos recursos importantes como o carrinho de compras de uma loja virtual, um Blog e uma Área Reservada.

Os recursos avançados são:

Menu Principal

Aqui você pode projetar o estilo do menu principal, que aparecerá ou no alto ou na lateral de cada página para ajudar o visitante a se localizar por todo o seu site.

Menu suspenso

Você pode definir o estilo dos menus suspensos (menus que aparecem quando o cursor do mouse se move sobre um item do menu principal).

Sub-menus

Você pode definir o estilo do menu de página. Menus de página listam as diversas páginas que estão no mesmo nível.

Estilos e Modelos

Você pode definir o estilo dos trechos de texto que aparecem nas páginas, da janela ShowBox vinculada ao Objeto Galeria, das Tooltips que podem ser vinculadas aos Link e dos emails se você usar o Objeto Formulário de Email ou se criar um Carrinho de compras.

Página de introdução

Você pode incluir uma Página de Introdução, para dar as boas-vindas aos visitantes do seu site. A página de introdução pode ter um fundo musical e opções para outros idiomas.

Mensagem publicitária

Você pode configurar e personalizar um anúncio para ser exibido somente na Página Inicial ou em todas as páginas do site, em uma posição específica.

Blog

Você pode criar e gerenciar um Blog, que será como um diário online onde você poderá publicar suas novidades e os visitantes poderão fazer comentários sobre elas.

RSS Feed

Você pode criar e gerenciar um RSS feed, que é um instrumento útil para manter um canal de notícias atualizado.

Gerenciar Dados

Aqui você pode indicar como o envido de dados deverá ser tratado nas diversas áreas do site onde os visitantes podem enviar dados: emails, no Blog, no Livro de Visitas, no carrinho de compras.

Gerenciar acesso

Você pode criar perfis para os visitantes que terão acesso às Páginas Protegidas do site, e você poder organizá-los em grupos. Páginas Protegidas, definidas no Passo 2 - Criação do mapa, criam Áreas Reservadas que precisam de um nome de usuário e senha para poder acessá-las. De acordo com o perfil de cada usuário, as credenciais que você especificar determinam a quais Páginas Protegidas na Área Reservadas o usuário terá acesso.

Carrinho de compras

Você pode criar e gerenciar um carrinho de compras de uma Loja Virtual, definindo listas de produtos, formas de envio e de pagamento, o layout dos seus formulários de pedidos, etc.

Para maiores informações sobre como criar o Mapa do site e as diferenças entre menus de primeiro e segundo nível, menus suspensos e menus de página, veja Criação do mapa.


Estilo do Menu Principal

Passo 4 - Configurações Avançadas >

Estilo do Menu Principal

 Return to chapter overview
Exibir/Ocultar o texto oculto

Nesta janela você pode projetar o estilo dos botões no primeiro nível do menu principal.

Os menus são criados e atualizados automaticamente pelo programa de acordo com o mapa do website, conforme concebido no Passo 2 - Criação do mapa. O menu principal exibe os itens de primeiro nível do mapa do site que são usados para criar o menu de navegação. Se você tiver escolhido uma estrutura de menu horizontal, o menu principal aparece imediatamente acima ou abaixo do cabeçalho em todas as páginas. Se tiver escolhido uma estrutura de menu vertical, o menu principal é exibido na lateral das páginas, ou à esquerda ou à direita de seu conteúdo.

Os comandos para personalizar os botões do menu são organizados nas seguintes abas: Geral, Itens de Menu e Estilo 3D.

Clique para expandir/recolher Referência: Comandos na aba Geral

Você pode usar estes comandos para estabelecer algumas definições gerais para o menu principal.

As opções na seção Estilo são:

§Largura: você pode determinar a largura em pixels para os botões dos itens de menu.

§Margem: você pode especificar margens horizontal e vertical em pixels (o espaço entre a borda do botão e o texto dentro do botão).

§Distância entre os botões: você pode especificar a margem externa em pixels (o espaço entre cada botão).

§Deslocamento automático do menu: selecione esta opção se quiser que o menu de navegação se desloque junto com o conteúdo das páginas, ficando sempre visível.

Quando você define a largura dos botões, leve em conta o espaço geral disponível para este menu: este parâmetro pode ser alterado se você não estiver usando um modelo padronizado (veja Modelo personalizado).

As opções na seção Texto são:

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Alinhamento: você pode especificar como deseja que o texto fique alinhado dentro do botão: à Esquerda, no Centro ou à Direita.

§Usar Antialias no texto: selecione esta opção se quiser bordas mais suaves.
Clique para expandir/recolher Referência: Comandos na aba Itens de Menu

Você pode usar os comandos nesta aba para definir cores, imagens de fundo e estilo do texto para os diversos estados dos botões do menu principal.

Em primeiro lugar, selecione o Item de Menu no qual deseja trabalhar: você pode definir o estilo do [image] Item de Menu e do [image] Item sob cursor/Página atual. Você pode selecionar um elemento do menu a partir da lista suspensa ou você pode trabalhar diretemente na pré-visualização, que é mantida constantemente atualizada com qualquer alteração que você faça.

As opções na seção Estilo ficam disponíveis para todos os itens de menu:

§Cor do fundo / Cor do texto / Cor da borda: você pode definir a cor para o plano de fundo, texto e borda do botão.

§Imagem de fundo: você pode especificar a imagem a ser usada como plano de fundo para o botão. Clique em [image] para navegar entre os arquivos disponíveis (nos formatos .JPG, .GIF ou .PNG) para selecionar uma imagem. Ou clique na seta ao lado do campo para abrir a biblioteca de botões e selecionar lá a imagem que deseja usar.

§Estilo da fonte: esta opção define o estilo do texto do botão para o Item de Menu: pode ser Nenhum, Baixo relevo, Alto relevo, ou Sombra. O Item sob cursor/Página atual automaticamente assume a configuração definida para o Item de Menu: você também pode adicionar um destes estilos: Normal, Negrito, Itálico, Negrito Itálico.
Clique para expandir/recolher Referência: Comandos na aba Estilo 3D

Você pode usar os comandos nesta seção para definir os botões com efeito 3D.

As opções a seguir estão disponíveis na seção Forma :

§Forma: escolha um formato de botão entre os disponíveis.

§Arredondamento: determine a intensidade do efeito de chanfrado nos cantos dos botões (para formatos com cantos arredondados).

§Combinar a forma dos botões: combinar os botoões para que o formato selecionado seja aplicado a todos em conjunto.

As seguintes opções estão disponíveis na seção Formato 3D:

§Aparência: você pode definir a aparência do botão como Plano, Convexo plano, Chanfrado, etc.

§Direção da luz: você pode definir a direção do efeito de luz sobre o botão.

§Fator do gradiente: você pode definir a quantidade de sombreamento para o botão.

§Opacidade da imagem: você pode especificar o grau de transparência das imagens que forem adicionadas aos botões na seção Itens de Menu .

A seção Borda 3D tem as seguintes opções:

§Estilo da borda: você pode definir as bordas dos botões como Normal, Chanfrado ou Côncavo.

§Espessura externa / Espessura interna: você pode especificar a espessura externa e interna da borda dos botões.

§Borda externa única: se você selecionar esta opção, suas preferências serão aplicadas às bordas em torno de todos os botões, e não somente de um único botão.


Estilo do Menu Suspenso

Passo 4 - Configurações Avançadas >

Estilo do Menu Suspenso

 Return to chapter overview
Exibir/Ocultar o texto oculto

Os comandos nesta janela são usados para definir o estilo dos menus suspensos.

Os menus são criados e atualizados automaticamente pelo programa de acordo com o mapa do website, conforme concebido no Passo 2 - Criação do mapa. Menus suspensos são exibidos quando o cursor do mouse passa sobre um item do menu principal.

Os comandos são organizados nas seguintes abas: Geral, Itens de Menu and Estilo 3D.

Clique para expandir/recolher Referência: Comandos na aba Geral

Você pode usar os comandos nesta aba para definir algumas configurações gerais para os menus suspensos.

Primeiro você tem que indicar qual Tipo de menu você quer, que pode ser:

Dispor em uma coluna: todos os itens do menu suspenso aparecem em uma única coluna, um abaixo do outro.

Dispor em mais colunas: os itens do menu suspenso aparecem em várias colunas adjacentes. Uma nova coluna é adicionada automaticamente quando:

§a quantidade de itens no menu suspenso atinge ou é maior que o valor em Máximo de itens por Coluna;

§a lista de páginas tem um separador (veja Criação do mapa).

Se você tiver escolhido um menu vertical na janela Seleção do Modelo ou na janela Modelo personalizado, você também poderá selecionar:

Abertura em zigzag: todos os itens no menu suspenso aparecem em uma única coluna: quando você clicar em um item, todos os itens abaixo dele se deslocam para baixo para deixar espaço para exibir uma nova lista de itens que estavam ocultos até então, e que se relacionam com o item selecionado.

Quando tiver selecionado o Tipo de menu, você poderá trabalhar nas opções na seção Estilo:

§Largura: você pode determinar a largura em pixels para os botões dos itens de menu.

§Margem: você pode especificar margens horizontal e vertical em pixels (o espaço entre a borda do botão e o texto dentro do botão).

§Máximo de itens por Coluna: esta opção só fica disponível para o tipo de menu Dispor em mais colunas. Você pode especificar a quantidade máxima de itens para cada coluna do menu suspenso.

As opções na seção Texto são:

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Alinhamento: você pode especificar como deseja que o texto fique alinhado dentro do botão: à Esquerda, no Centro ou à Direita.

Finalmente, a seção Opções apresenta as seguintes opções:

§Efeito: você pode especificar o efeito de exibição para os menus suspensos, escolhendo entre Nenhum, Dissolver, Surgir pelo alto, Surgir pela esquerda ou Surgir pelo alto à esquerda.

§Selecionar a Página atual automaticamente: esta opção só fica disponível para o tipo de menu Abertura em zigzag. O menu suspenso é automaticamente expandido e a página onde estiver é exibida como selecionada no menu.
Clique para expandir/recolher Referência: Comandos na aba Itens de Menu

Os comandos nesta aba são para definir as cores, as imagens de fundo e o estilo do texto para os diversos estados dos botões nos menus suspensos.

Em primeiro lugar, você tem que selecionar o Item de Menu em que irá trabalhar: você pode especificar o estilo do [image] Item de Menu, [image] Item sob cursor e [image] Separador. Você pode selecionar um elemento do menu a partir da lista suspensa ou você pode trabalhar diretemente na pré-visualização, que é mantida constantemente atualizada com qualquer alteração que você faça.

As opções na seção Estilo estão disponíveis para todos os itens de menu:

§Cor do fundo / Cor do texto / Cor da borda: você pode definir a cor para o plano de fundo, texto e borda do botão. O Separador só tem a opção Cor do texto.

§Estilo da fonte: você pode definir o estilo do texto para o Item sob cursor e o Separador como Normal, Negrito, Itálico e Negrito itálico.

§Imagem de fundo: só fica disponível para o Item de Menu e o Item sob cursor, e você pode especificar a imagem a ser usada como plano de fundo para o botão. Clique em [image] para navegar entre os arquivos disponíveis (nos formatos .JPG, .GIF ou .PNG) para selecionar uma imagem. Ou clique na seta ao lado do campo para abrir a biblioteca de botões e selecionar lá a imagem que deseja usar.

§Ícone do marcador: você pode especificar a imagem que será usada como marcador para as listas de botões e separadores. Clique em [image] e selecione um arquivo .JPG, .GIF ou .PNG.
Clique para expandir/recolher Referência: Comandos na aba Estilo 3D

Você pode usar os comandos nesta seção para definir os botões com efeito 3D.

As opções a seguir estão disponíveis na seção Forma :

§Forma: escolha um formato de botão entre os disponíveis.

§Arredondamento: determine a intensidade do efeito de chanfrado nos cantos dos botões (para formatos com cantos arredondados).

§Combinar a forma dos botões: combinar os botoões para que o formato selecionado seja aplicado a todos em conjunto.

As seguintes opções estão disponíveis na seção Formato 3D:

§Aparência: você pode definir a aparência do botão como Plano, Convexo plano, Chanfrado, etc.

§Direção da luz: você pode definir a direção do efeito de luz sobre o botão.

§Fator do gradiente: você pode definir a quantidade de sombreamento para o botão.

§Opacidade da imagem: você pode especificar o grau de transparência das imagens que forem adicionadas aos botões na seção Itens de Menu .

A seção Borda 3D tem as seguintes opções:

§Estilo da borda: você pode definir as bordas dos botões como Normal, Chanfrado ou Côncavo.

§Espessura externa / Espessura interna: você pode especificar a espessura externa e interna da borda dos botões.

§Borda externa única: se você selecionar esta opção, suas preferências serão aplicadas às bordas em torno de todos os botões, e não somente de um único botão.


Estilo do Menu de Página

Passo 4 - Configurações Avançadas >

Estilo do Menu de Página

 Return to chapter overview
Exibir/Ocultar o texto oculto

Esta janela possibilita definir algumas configurações avançadas para os botões nos menus de página.

Os menus são criados e atualizados automaticamente pelo programa de acordo com o mapa do website, conforme concebido no Passo 2 - Criação do mapa. Os menus de página são opcionais, e eles exibem uma lista de páginas que estão no mesmo nível atual. Em outras palavras, se você abrir uma página em um certo nível, e se este nível tiver outras páginas, o menu de página mostra uma lista de todas as páginas naquele nível. Os menus de página são sempre verticais, e podem ser exibidos à esquerda ou à direita do conteúdo da página.

Os comandos para personalizar os botões nos menus de página estão organizados nas abas Geral e Itens de Menu.

Clique para expandir/recolher Referência: Comandos na aba Geral

Você pode usar os comandos nesta aba para definir algumas configurações gerais para o menu de página.

Se quiser exibir um menu de página que inclua todas as páginas do nível atual, você deve selecionar a opção Mostrar o Menu de Página.

Quando tiver feito isto, você poderá trabalhar nas opções na seção Estilo:

§Posição do menu: escolha se quer que o menu de página seja exibido no lado esquerdo ou no lado direitao da página.

§Largura: você pode determinar a largura em pixels para os botões dos itens de menu.

§Margem: você pode especificar margens horizontal e vertical em pixels (o espaço entre a borda do botão e o texto dentro do botão).

§Distância entre os botões: você pode definir o valor da margem externa, em pixels (o espaço entre um botão e o outro).

As opções na seção Texto são:

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Alinhamento: você pode especificar como deseja que o texto fique alinhado dentro do botão: à Esquerda, no Centro ou à Direita.

Finalmente, na seção Bordas personalizadas você pode criar uma borda em torno do menu de página (não em torno dos botões individualmente) e trabalhar com as seguintes opções:

§Espessura: a espessura das bordas (cada uma pode ser definida individualmente).

§Cor: a cor das bordas (novamente, cada borda pode ser colorida individualmente).

§Cantos arredondados: o grau de arrendondamento dos cantos (cada um pode ser definido individualmente).

§Sombra: uma sombra, especificando sua cor, posição, difusão e tamanho.
Clique para expandir/recolher Referênica: Comandos na aba Itens de Menu

Você pode usar os comandos nesta aba para definir o estilo dos itens dos menus de página.

Em primeiro lugar, selecione o Item de Menu no qual irá trabalhar: você pode definir o estilo do Item de Menu, [image] Item sob cursor/Página atual, [image] Separador e [image] Linha de separação. Você pode selecionar um elemento do menu a partir da lista suspensa ou você pode trabalhar diretemente na pré-visualização, que é mantida constantemente atualizada com qualquer alteração que você faça.

§Cor do fundo / Cor do texto / Cor da linha: você pode escolher uma cor para o plano de fundo e para o texto do Item de Menu, do Item sob cursor/Página atual e do Separador, e a cor da Linha de separação.

§Ícone do marcador: esta opção é para o Item de Menu, o Item sob cursor/Página atual e o Separador, e permite que você importe um arquivo .JPG, .GIF ou .PNG contendo a imagem que irá usar como marcador ao lado dos itens no menu de página.

§Estilo da fonte: esta opção é para o Item sob cursor/Página atual e o Separador, e você pode definir o texto como Normal, Negrito, Itálico ou Negrito Itálico.

§Estilo da linha: esta opção só fica disponível para a Linha de separação, e é usada para definir o estilo da linha, que pode ser Inteira, Tracejada, Pontilhada, Baixo relevo ou Alto relevo.


Estilos e Modelos

Passo 4 - Configurações Avançadas >

Estilos e Modelos

 Return to chapter overview
Exibir/Ocultar o texto oculto

Nesta janela, você pode decidir quais estilos serão aplicados aos vários elementos de texto nas páginas, ao ShowBox que é associado a elementos como Objeto Galeria e Objeto Lista de Produtos, às Tooltips que são associadas a Link e aos emails que são criados se você usar o Objeto Formulário de Email ou se montar um Carrinho de compras.

Um estilo pode ser genericamente definido como uma série de indicações de formatação de texto e a parte gráfica que são aplicados a um elemento para mudar sua aparência. Usando o Estilos e Modelos, você pode incluir diversos formatos diferentes em uma única operação.

Os comandos para deifinir seus estilos estão organizados nas seguintes abas: Texto, ShowBox, Tooltip e Email.

Clique para expandir/recolher Referência: Comandos na aba Texto

Os comandos nesta aba podem ser usados para definir o estilo dos diversos textos que aparecem no site.

Em primeiro lugar, você tem que escolher para qual Item de página deseja definir um estilo. Selecione na lista suspensa ou clique no item a partir da pré-visualização.

Os itens de página aos quais você pode aplicar um estilo são:

Título da página: é o título de cada página do site. É obtido a partir do nome dado à página quando o Mapa do site foi criado na janela Criação do mapa, ou, se assim especificado, do Título completo da Página na janela Propriedades da Página.

Endereço da página: é o texto que aparece imediatamente abaixo do título da página, e exibe o caminho para chegar à esta página no site ("navegação breadcrumb"). O Programa adiciona o endereço automaticamente.

Texto da Página: é o texto de cada parágrafo que é adicionado usando o Objeto Texto. O estilo indicado aqui é aplicado por padrão a todo texto inserido no editor Objeto Texto: você pode usar os comandos fornecidos no editor para fazer alterações. O estilo de texto padrão também é aplicado ao texto que é adicionado automaticamente pelo Programa, como as páginas da Área Reservada, no Blog, no mecanismo de busca interno e no Mapa do site.

Link ativo / Link sob cursor / Link visitado: estas opções se referem aos links de hipertexto criados com o Objeto Texto. Um link pode alterar sua aparência de acordo com seu estado: ativo, sob foco, já visitado. Alterar a aparência de um link de acordo com seu estado atual facilitam a navegação pelo site, lembrando o visitante sobre quais páginas já foram visitadas.

Campo / Botão: estes são campos e botões que são criados pelo Objeto Formulário de Email ou pelo carrinho de compras, além dos elementos nos campos de busca (veja Personalização do modelo | Inserir campo de busca), os campos de login/logout da Área Reservada, etc. Quando você cria um novo Objeto Formulário de Email os campos nele vão adquirir o estilo definido aqui como padrão. Você poderá depois alterar o estilo em novos formulários de email usando as opções na seção Objeto Formulário de Email | Estilo.

Menu de rodapé da página: este menu repete os itens do menu principal e exibe-os no final de cada página.

Se você selecionar Item de página, poderá trabalhar nas opções da seção Estilo para alterar o estilo:

§Visível: você pode decidir se o item de página selecionado ficará visível ou não. Esta opção não fica disponível para o Texto da Página nem para os diversos estados dos links, campos e botões, pois eles não podem ficar invisíveis. Tornar um item invisível não significa removê-lo da página. Simplesmente significa que o item não ficará visível quando a página for publicada. Você pode querer tornar o Título da página invisível, por exemplo, porque pode preferir adicionar uma imagem em vez de um texto, mas isto não significa que a tag <title> terá sido removida do código HTML.

§Cor do fundo / Cor do texto: você pode escolher a cor do fundo e a da fonte do item de página selecionado. Você não pode escolher a cor do fundo para o Texto da Página porque isso depende do modelo escolhido (veja Seleção do Modelo or Modelo personalizado) e/ou do Estilo da célula que o Objeto Texto tem.

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Alinhamento: você pode decidir como alinhar o elemento na página: Pode ser à esquerda, no centro ou à direita. Esta opção não fica disponível para os campos, botões ou links, porque o alinhamento do link hipertexto é definido quando o Objeto Texto é criado, independente do estilo.

§Estilo do texto: esta opção só fica disponível para os link nos diversos estados (visitado, etc) e pode ser Normal ou Sublinhado.

§Cursor: esta opção fica disponível somente para o Link ativo, e é assumida automaticamente pelos dois outro estados de link. Você pode especificar o estilo quando sob foco. Clique em [image] para selecionar o arquivo .CUR ou .ICO que será usado.

§Cor da borda: você pode especificar a cor das bordas do Título da página, do Endereço da página, do Campo, do Botão e do Menu de rodapé da página.

§Cantos arredondados: você pode indicar o quanto os cantos serão arredondados em Campo e Botão, e você pode especificar o valor para cada canto separadamente.

§Sombra: você pode aplicar uma sombra dentro do Campo, especificando sua cor, posição, difusão e tamanho.

§Margem horizontal: você pode especificar a margem horizontal de Título da página, Endereço da página e Menu de rodapé da página.
Clique para expandir/recolher Referência: Comandos na aba ShowBox

Você pode usar os comandos nesta aba para definir o estilo da ShowBox que é usada nas galerias (veja Objeto Galeria), no link Galeria com ShowBox (veja Link | Ação) e em Objeto Lista de Produtos. Em todos os casos, a ShowBox se abre em um link e exibe uma imagem ampliada, um vídeo, ou uma apresentação de slides: quando um visitante clicar em um link para uma ShowBox, a janela do navegador é esmaecida para destacar a janela da ShowBox, que é exibida em primeiro plano com o efeito de entrada selecionado.

As opções na seção Estilo são:

§Efeito de transição: você pode especificar o efeito de entrada para a janela ShowBox, que pode ser Nenhum, Dissolver, Descer, Zoom, Zoom e ocultar a imagem inicial. O efeito Zoom e Zoom e ocultar a imagem inicial são muito parecidos: a diferença é que ou a foto original permanece visível ou fica oculta quando ampliada. O efeito Zoom e ocultar a imagem inicial é, portanto, particularmente conveniente quando fotos forem exibidas na ShowBox, em vez de texto.

§Cor externa / Cor interna: você pode escolher a cor de fundo na área externa/interna da ShowBox. A cor de fundo externa é semi-transparente (de acordo com as configurações em Opacidade do fundo), e é usada para esmaecer a janela do navegador logo abaixo.

§Opacidade do fundo: você pode especificar a transparência para o fundo externo. Valores mais altos diminuem a visibilidade da janela do navegador sob a imagem.

As opções para Texto são:

§Cor do texto: você pode escolher a cor da fonte que será usada dentro da janela ShowBox.

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Alinhamento: indica como o texto será alinhado dentro da janela ShowBox: à Esquerda, no Centro, ou à Direita.

As seguintes opções ficam disponíveis para Bordas personalizadas:

§Espessura: a espessura das bordas (cada uma pode ser definida individualmente).

§Cor: a cor das bordas (novamente, cada borda pode ser colorida individualmente).

§Cantos arredondados: o grau de arrendondamento dos cantos (cada um pode ser definido individualmente).

§Sombra: uma sombra, especificando sua cor, posição, difusão e tamanho.
Clique para expandir/recolher Referência: Comandos na aba Tooltip

Os comandos nesta seção são usados para definir o estilo das Tooltips que são associadas a links adicionados a textos e imagens com o comando Inserisci collegamento Link. Uma Tooltip é um texto curto que aparece em um balão quando o cursor do mouse passa sobre um link: ele serve para explicar o que irá acontecer quando o link for clicado

Você pode começar a definir as Tooltips com as opções na seção Estilo:

§Posição das Tooltips: escolha se quer que a Tooltip seja exibida à Esquerda, Direita, Acima ou Embaixo do link.

§Efeito de transição: você pode especificar um efeito de entrada para as Tooltips, que pode ser Nenhum, Dissolver ou Alternado.

§Cor do fundo: você pode escolher a cor de fundo das Tooltips.

§Opacidade do fundo: você pode especificar a transparência para o fundo externo. Valores mais altos diminuem a visibilidade da janela do navegador sob a imagem.

§Mostrar seta: você pode adicionar uma seta para o balão que apontará em direção ao link ao qual a Tooltip se refere.

As opções para Texto são:

§Cor do texto: você pode escolher a cor da fonte usada nas Tooltips.

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Alinhamento: indica como o texto será alinhado dentro das Tooltips: à Esquerda, no Centro, ou à Direita.

As opções para Bordas personalizadas são:

§Espessura: a espessura das bordas (cada uma pode ser definida individualmente).

§Cor: a cor das bordas (novamente, cada borda pode ser colorida individualmente).

§Cantos arredondados: o grau de arrendondamento dos cantos (cada um pode ser definido individualmente).

§Sombra: uma sombra, especificando sua cor, posição, difusão e tamanho.

AS configurações de estilo são válidas para todo o projeto, e assim as Tooltips terão a mesma aparência sempre. O conteúdo de uma Tooltip (texto ou imagem) é definido na janela Link | Descrição.
Clique para expandir/recolher Referência: Comandos na aba Email

Os comandos nesta seção são para definir o estilo dos emails criados no Objeto Formulário de Email ou no Carrinho de compras.

Em primeiro lugar, você tem que selecionar o Item de email para o qual deseja definir um estilo, selecionando-o na lista suspensa ou clicando nele dentro da janela de pré-visualização.

Os elementos de um email para os quais você poderá definir o estilo são:

Layout do email: os emails criados pelo Programa têm todos um layout idêntico: um fundo externo com uma área central para a mensagem. Você pode incluir uma borda em torno da área central para separar visualmente a mensagem do conteúdo.

Imagem/Logo da empresa: você pode adicionar uma imagem ao cabeçalho do email. Pode ser o logo da empresa, um banner, etc.

Conteúdo da Mensagem: é a área central do email, onde a mensagem será escrita.

Nota de rodapé: é o texto que encerra o email. Normalmente é um texto padrão que tem um estilo diferente para distinguir da mensagem principal.

As opções para cada Item de email são exibidas na seção Estilo:

Layout do email

§Cor do fundo: você pode escolher a cor para o plano de fundo do email.

§Cor da borda / Espessura: você pode definir a cor e a espessura da borda que separa a área central principal do plano de fundo.

Imagem/Logo da empresa

§Arquivo de imagem: você pode escolher uma imagem para adicionar ao cabeçalho do email. Clique em [image] para selecionar o arquivo .JPG, .GIF ou .PNG a ser importado.

§Alinhamento: você pode escolher como a imagem deverá ser alinhada no cabeçalho:à Esquerda, no Centro, ou à Direita.

§Posição: você pode indicar se quer que a imagem seja colocada Dentro do quadro ou Fora do quadro da área principal.

§Largura: a largura da imagem original é exibida automaticamente, e você pode modificá-la. A largura máxima é 700 pixels, e depende do layout do email. Este parâmetro garante que os emails sejam sempre exibidos corretamente por todos os destinatários.

Conteúdo da Mensagem

§Cor do fundo: você pode selecionar a cor do plano de fundo do texto da mensagem.

§Cor do texto: você pode escolher a cor da fonte para o texto da mensagem.

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

Nota de rodapé

§Cor do fundo: você pode selecionar a cor de fundo do texto nas observações de encerramento.

§Cor do texto: você pode especificar a cor da fonte a ser usada no texto das observações de encerramento.

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Alinhamento: você pode especificar como o texto das observações no rodapé deverá ser alinhado: à Esquerda, no Centro, ou à Direita.

§Posição: você pode definir se quer que as observações de encerramento sejam posicionadas Dentro do quadro ou Fora do quadro da área principal.

§Texto: você pode redigir o texto das observações de encerramento. Um texto padrão sobre a natureza confidencial do email é disponibilizado.


Página de introdução

Passo 4 - Configurações Avançadas >

Página de introdução

 Return to chapter overview
Exibir/Ocultar o texto oculto

Nesta janela você pode criar uma página de Introdução para seu website, e oferecer opções de idiomas que os visitantes podem escolher para acessar e ver o site.

Como o nome sugere, a página de Introdução é uma espécie de capa para o website: pode ter uma foto, uma animação em Flash ou um vídeo nela, e normalmente é exibida por um tempo determinado antes que a Página Inicial seja exibida. Algumas vezes os visitantes têm que clicar para poder passar para a Página Inicial (com uma mensagem do tipo "pular introdução"). Se o site estiver disponível em mais de um idioma, as opções de idiomas às vezes são oferecidas nesta página.

Clique para expandir/recolher Referência: Comandos para criar uma página de Introdução

Nem todo site tem uma Página de Introdução. Se você quiser incluri uma no seu website, selecione a opção Mostrar Página de introdução. Lembre-se que se você criar uma página de Introdução, ela será sempre a primeira a ser exibida.

Você pode especificar o conteúdo e o plano de fundo, e adicionar uma música de fundo se desejar.

As opções para o Conteúdo da página são:

§Tipo: você pode especificar que tipo de conteúdo será adicionado à sua Página de Introdução. O conteúdo pode ser uma Imagem, animação em Flash, Vídeo e código HTML.

§Arquivo: se você escolher uma Imagem, animação Flash ou Vídeo como conteúdo em Tipo, você precisará importar o arquivo para a imagem (no formato .JPG, .GIF ou .PNG), para a animação Flash (no formato .SWF) ou para o vídeo (no formato .FLV, .MP4, .WEBM ou .OGG) para poder usar.

§Código HTML: se você escolher o código HTML como conteúto em Tipo, você poderá inserir o código aqui. A barra de ferramentas contém as seguintes ferramentas:

Cortar [CTRL+X] - Copiar [CTRL+C] - Colar [CTRL+V]

Estas opções cortam, copiam e colam o texto selecionado.

Desfazer [CTRL+Z] - Refazer [ALT+CAPS+BACKSPACE]

Estes comandos desfazem/refazem a última operação a ser feita/desfeita.

Inserir Widgets

Esta opção insere o código do widget selecionado: clique na seta ao lado do botão para exibir a lista completa de widgets, como eles aparecem em Objeto HTML e Widgets. Clique no widget que deseja abrir na janela Widget, onde você poderá configurar os parâmetros necessários. Quando confirmar, o código HTML para o widget será redigido e adicionado automaticamente no editor.

§Tamanho: você pode especificar a largura e a altura da Imagem, da animação Flash, Vídeo ou código HTML em pixels. Deixe o Manter proporções selecionado para manter a proporção entre a largura e a altura.

As seguintes opções estão disponíveis para o Fundo da página:

§Cor do fundo: você pode especificar a cor do plano de fundo da Página de Introdução.

§Arquivo de imagem: indica o arquivo (.JPG, .GIF, .PNG.) da imagem a ser usada como plano de fundo.

§Repetir: indica se a imagem do plano de fundo da página deverá ser repetida ou não. Ela pode ser repetido horizontal, verticalmente ou em ambas direções (ladrilho) para ocupar todo o espaço disponível. A imagem do plano de fundo também pode ser redimensionada para se ajustar ao espaço disponível.

§Alinhamento: você pode especificar como a imagem deverá ser alinhada na janela do navegador.

Estas Opções também estão disponíveis:

§Som de entrada: você pode indicar o arquivo de áudio (no formato .MP3) a ser usado como música de fundo quando a página de Introdução é exibida.

§Redirecionar para home page [seg.]: você pode especificar o número de segundos em que a página de Introdução é exibida, e após decorrido este tempo, a Página Inicial aparece automaticamente.
Clique para expandir/recolher Referência: Comandos para opção de idioma

Se seu site estiver disponível em mais de um idioma, e você quiser que os visitantes possam escolher qual idioma preferem a partir da página de Introdução, selecione a opção Mostrar links para outros idiomas.

Monte a lista de idiomas que pretende oferecer na Lista de idiomas. Há cinco idiomas na lista, por padrão: você pode usar os seguintes comandos para alterar a lista:

§Adicionar... / Remover: você pode adicionar um idioma à lista na janela Configurações de idioma, ou remover um idioma da lista.

§Para cima / Para baixo: você pode alterar a ordem dos idiomas na lista, movendo o idioma selecionado para uma posição acima ou abaixo.

§Pré-definido: você pode definir um dos idiomas na Lista de idiomas como sendo o idioma "padrão". Ele será o idioma usado no site ao ser aberto. A página de Introduçâo só aparece no site com o idioma padrão (para maiores informações, veja Como criar um site em vários idiomas).

§Editar...: esta opção abre Configurações de idioma onde você pode alterar as configurações para o idioma selecionado em Lista de idiomas.

Esta opção também está disponível:

§Esegui collegamento in una nuova finestra: se você selecionar esta opção, o site é aberto em uma nova janela do navegador, e não na janela que estiver exibindo a página de Introdução.

Apesar de termos falado principalmente sobre opções de idiomas na página de Introdução, há outros recursos que você pode incluir aqui. Você poderia, por exemplo, oferecer opções como "versão em HTML / versão em Flash" ou "Conteúdo adequado a todas as idades / Somente para adultos".

Se você incluir uma página de Introdução no seu site, uma página especial "Página de Introdução" é adicionada automaticamente ao Mapa do site. Selecione-a e abra a janela Propriedades da Página para definir as principais características.

Melhores práticas:

- | Como traduzir um texto automático
- | Como criar um site em vários idiomas


A janela Configurações de idioma

Configurações de idioma

Passo 4 - Configurações Avançadas > Página de introdução >

Configurações de idioma

 Return to chapter overview

Esta janela se abre quando você clica nos botões Adicionar... ou Editar... na janela Página de introdução, e você pode especificar diversos parâmetros para os idiomas disponíveis para seu website.

As opções são:

§Nome do idioma a exibir: você pode inserir o nome do idioma que deseja disponibilizar. Clique na seta ao lado do campo para abrir um menu popup que exibe uma lista de idiomas possíveis, e selecione um que deseje adicionar. Você também pode digitar o nome do idioma diretamente no campo.

§Arquivo de imagem para o idioma (p.ex: bandeira): você pode especificar o nome do arquivo de imagem a ser usado na criação do botão pra o idioma. Clique em [image] para selecionar o arquivo .JPG, .GIF ou .PNG a ser usado para criar um botão com a imagem da bandeira que representa o idioma, por exemplo.

Se você não associar nenhuma imagem ao botão, um link de texto será criado automaticamente, usando o Nome do idioma a exibir como texto.

§Link para este Idioma (isto é: mostrar o Site neste idioma): você pode criar um link na imagem que importar, usando a opção Arquivo de imagem para o idioma (p.ex: bandeira). Clique no botão [image] para abrir a janela Link onde poderá selecionar a ação e opções relacionadas.

Se, por exemplo, o site no idioma indicado pela bandeirja já tiver sido publicado, você pode selecionar a opção Arquivo ou URL e inserir a URL (endereço do site) para criar um link para ele (por exemplo, http://www.meusite.com.br/en/index.html). Se você estiver trabalhando no idioma padrão, você não poderá usar esta opção porque ela é automaticamente vinculada à Página Inicial do site atual.

Observações sobre compatibilidade com as versões anteriores:

A janela Configurações de idioma foi alterada da seguinte forma na versão 10:

§A opção Endereço relativo no servidor ou URL do website para este idioma foi substituída pela opção Link para este Idioma (isto é: mostrar o Site neste idioma). Você ainda pode definir um link para o arquivo ou URL, mas você também pode fornecer outras indicações.

§A opção Exibir este idioma mas avisar que não está disponível ainda foi removida porque agora você pode criar uma mensagem personalizada, configurando um link mais adequado no botão da bandeira.

Melhores práticas:

- | Como traduzir um texto automático
- | Como criar um site em vários idiomas


Mensagem publicitária

Passo 4 - Configurações Avançadas >

Mensagem publicitária

 Return to chapter overview
Exibir/Ocultar o texto oculto

Esta mensagem exibe os comandos para incluir um anúncio seja somente na Página Inicial, seja em todas as páginas do seu site.

O anúncio pode ser uma imagem ou uma animação Flash, exibida em uma posição específica da página, e que tem um link para uma "página de destino". Uma página de destino é uma página normal do site, mas você deve analisar o conteúdo desta página cuidadosamente já que ela serve para transmitir uma mensagem específica ao visitante, encorajando-o a preencher um formulário, efetuar uma compra, etc.

Clique para expandir/recolher Referência: Comandos para incluir anúncios

Se você quiser incluir um anúncio, primeiro deverá selecionar a opção Mostrar a Mensagem publicitária.

Você pode escolher o Tipo de mensagem a partir dos seguintes itens:

Mostrar anúncios no canto superior direito: este anúncio é frequentemente chamado de "Pagepeel" (vira-página): com o cursor do mouse no canto superior direito da janela, o canto é "virado como uma página" para exibir o anúncio sob ele.

Mostrar anúncios em um quadro: este anúncio é exibido em uma caixa em uma posição específica na página, em primeiro plano sobre o conteúdo da página.

Mostrar anúncios em uma barra horizontal: o anúncio é exibido como um banner (faixa) no alto da janela do navegador, sobre o conteúdo da página, ou ao pé da janela sobreposto ao conteúdo da página.

A seção de Configurações oferece as seguintes opções para cada Tipo de mensagem:

§Arquivo de imagem: você pode especificar o arquivo de imagem (no formato .JPG, .GIF ou .PNG) ou o arquivo com animação Flash (no formato .SWF) que contém o anúncio que deseja adicionar.

Para o item Mostrar anúncios no canto superior direito, você também pode escolher as seguintes opções:

§Estilo: você pode escolher o clássico pagepeel (vira-página), ou um outro efeito. Todos os efeitos funcionam do mesmo modo: o anúncio oculto embaixo da página é exibido quando o cursor do mouse passa sobre o canto.

§Largura/Altura: você pode especificar a largura e a altura em pixels do espaço dedicado ao anúncio.

As seguintes opções também ficam disponíveis para o item Mostrar anúncios em um quadro:

§Posição: você pode especificar onde, na janela do navegador, o anúncio deverá ser exibido. As opções são Centro, Alto à esquerda, Alto à direita, Embaixo à esquerda e Embaixo à direita.

§Efeito: você pode definir um efeito que será aplicado quando o anúncio aparecer. Pode ser Dissolver, Para baixo, Para cima, Para a direita ou Para a esquerda.

§Mostrar esta mensagem apenas uma vez: se você selecionar esta opção, o anúncio só e exibido uma vez, quando a página é aberta pela primeira vez (na próxima vez em que o site for visitado, o anúncio será exibido novamente).

Outras opções para Mostrar anúncios em uma barra horizontal são:

§Posição: você pode especificar se o banner do anúncio deverá ser exibido no alto da página, antes do conteúdo, ou ao pé da página, sobreposto ao conteúdo.

§Cor do fundo: você pode escolher a cor para o plano de fundo do banner.

§Mostrar esta mensagem apenas uma vez: se você selecionar esta opção, o anúncio só e exibido uma vez, quando a página é aberta pela primeira vez (na próxima vez em que o site for visitado, o anúncio será exibido novamente).

Estas Opções são para todos os tipos de anúncios:

§Link: você pode especificar o link (geralmente uma Página de Destino) que deverá ser ativado quando um visitante clicar no anúncio. Clique no botão [image] para abrir a janela Link onde poderá selecionar a ação e opções relacionadas.

§Som de entrada: você pode importar um arquivo de som (no formato .MP3) que você queira que seja executado enquanto o anúncio estiver à vista.

O que é uma Página de Destino?

A Página de Destino é a página onde o visitante "chega" depois de clicar em um link ou em um banner publicitário. Ela deverá ser criada de modo que o visitante encontre imediatamente a informação que deseja, sem ter que navegar para nenhum outro lugar do site.

Este conceito pode ser melhor explicado com um exemplo: você decide publicar um banner publicitário para anunciar a venda de um determinado produto. Somente as informações essenciais são fornecidas no banner, mas são o suficiente para despertar o interesse do visitante. Encaminhá-lo para a Página Inicial do site seria contraproducente porque ela é genérica demais e ele teria que perder tempo navegando pelo website para encontrar maiores informações sobre aquele produto específico pelo qual havia se interessado. Você estaria se arriscando a perder um freguês em potencial! Então, a melhor coisa a fazer é criar uma nova página com um layout simples, e que forneça todas as informações necessárias sobre o produto anunciado, inclusive como comprá-lo.

Você geralmente tem que criar uma página de Destino específica mas, se ela for bem feita, o trabalho valerá a pena, porque guiará o visitante ao objetivo proposto pelo banner (que é o de efetuar uma compra, neste caso).

Estas opções estão disponíveis na seção Modo de exibição:

§Exibir apenas na Página Inicial / Exibir em todas as páginas: você pode escolher se o anúncio será exibido em todas as páginas do site ou somente na Página Inicial.


Blog

Passo 4 - Configurações Avançadas >

Blog

 Return to chapter overview
Exibir/Ocultar o texto oculto

Aqui você encontrará todas as ferramentas e opções necessárias para montar um Blog e organizar os comentários que os visitantes podem vir a fazer sobre o que você publicar nele.

Um Blog é como um diário online. O autor escreve sobre o que ele quer em suas Postagens (artigos), que são publicados com uma certa regularidade.

Uma vez que tenha sido publicado, um Blog do WebSite X5 tem uma existência completamente separada do website principal, e é adicionado automaticamente ao Mapa do site na pasta de Páginas Especiais (veja Criação do mapa). Se você quiser adicionar o item "Blog" ao menu de navegação, você precisará criar um pseudônimo para a Página Especial, selecionando-a e arrastando-a para a pasta do Menu.

Porque ele é parte do website, o Blog terá o mesmo visual e o modelo do site será aplicado a ele automaticamente.

Seu Blog é publicado na URL http://www.meusite.com.br/blog onde http://www.meusite.com.br é o endereço do site ao qual o Blog está associado (o seu website).

A página principal do Blog lista todas as postagens que já foram publicadas, na ordem cronológica. Para cada Postagem, a lista fornece o título, autor, categoria, data e hora da publicação e, se for para exibir somente um resumo, um trecho das Postagens é exibido com um link para "Ler tudo". O link "Ler tudo" abre a Postagem específica em uma nova página, e o artigo completo é exibido. Quaisquer comentários que tenham sido feitos também serão exibidos, e novos comentários podem ser adicionados.

Além do conteúdo das Postagens, todas as páginas em um Blog têm a mesma estrutura: há uma coluna no lado direito da página que exibe ferramentas como Postagens Recentes, arquivo mensal/por categoria e Nuvens (clouds). Você pode personalizar esta coluna e decidir quais ferramentas ficarão disponíveis para os visitantes, e em que ordem elas vão aparecer na coluna.

A possibilidade de receber comentários de visitantes nas suas Postagens é uma excelente forma de desenvolver uma interação contínua entre leitores e autores. Para evitar que comentários ofensivos, irrelevantes ou inapropriados sejam publicados, o WebSite X5 fornece para você o Painel de Controle online, através do qual comentários indesejáveis podem ser interceptados.

Para criar um Blog, tudo o que você precisa fazer é definir alguns parâmetros gerais e criar a lista de notícias que deseja publicar.

Uma vez que tenha começado a publicar no seu Blog, você precisará manter os visitantes interessados publicando novas Postagens com uma certa regularidade. Para economizar tempo ao exportar seu projeto para a Internet, você pode optar por publicar somente as atualizações do seu Blog selecionando a opção Exportar apenas Blog e RSS Feed na janela Exportar o site para a internet.

Os comandos para criar um Blog e redigir Postagens estão organizados nas abas Postagens, Layout e Comentários.

Clique para expandir/recolher Referência: Comandos na aba Postagens

Você pode usar os comandos nesta aba para definir alguns parâmetros gerais e começar a criar a lista de Postagens a serem publicadas no seu Blog.

Você tem estas opções na seção Configurações Gerais:

§Título: insira o título que deseja dar ao seu Blog neste campo. O título é exibido na barra de títulos do navegador e, obviamente, é um elemento importante pois ajuda os visitantes e os mecanismos de busca a identificarem o Blog corretamente.

Se você não quiser dar um título ao seu Blog, o título do website será usado por padrão (aquele que você especificou na janela Configurações Gerais | Básicas).

§Descrição: escreva uma breve descrição do Blog neste campo. Seja breve mas claro e direto: esta descrição será usada no código HTML como conteúdo da meta tag <description>, e será usada pelos mecanismos de busca para identificar o seu Blog.

Se você não inserir uma descrição para o seu Blog, a descrição do seu website, fornecida na janela Configurações Gerais | Básicas, é que será usada.

§Criar um RSS Feed com o conteúdo do Blog: esta opção fica ativada por padrão, e significa que será criado um RSS Feed automaticamente com todas as Postagens do Blog. O endereço relativo para os RSS feeds do Blog é http://www.meusite.com.br/blog/x5feed.xml onde http://www.meusite.com.br é a URL do website ao qual o Blog está associado (o seu site).

A seção Lista de postagens exibe uma tabela resumindo o Título, Autor, Categoria e Data de publicação para cada Postagem, e os comandos para criar novas Postagens e organizar as existentes:

§Adicionar...: abre a janela Configurações de postagens, onde você poderá adicionar uma nova Postagem.

§Remover: remove a Postagem selecionada da Lista de postagens.

§Editar...: abre a janela Configurações de postagens onde você poderá editar a Postagem selecionada na Lista de postagens.
Clique para expandir/recolher Referência: Comandos na aba Layout

Os comandos nesta aba definem a aparência do seu Blog.

As seguintes opções estão disponíveis na seção Geral:

§Modo de Exibição das Postagens: você pode escolher como suas Postagens serão exibidas na primeira página do seu Blog. Você pode ter a primeira Postagem exibida por inteiro, seguida de um resumo para cada uma das outras, ou pode ter um resumo de cada Postagem. Os resumos têm um link "Ler tudo" associados a eles.

§Exibir o botão 'AddTHis' para compartilhar seu Site em redes sociais.: se você selecionar esta opção, o botão "AddThis" é adiconado automaticamente a cada Postagem do seu blog. Quando um visitante clicar neste botão, um sub-menu é exibido com uma lista das redes sociais mais comuns. Se o visitante já for membro de uma dessas redes, ele/ela poderá selecionar o botão correspondente e compartilhar com os contatos dele/dela o link para aquela Postagem.

§Tipo de botão: você pode selecionar o aspecto visual para o botão "AddThis" dentre os disponíveis no menu.

§Conta 'AddThis': se você tiver uma conta no AddThis, você poderá informar aqui. Se você tiver essa conta, poderá ver as estatísticas sobre como os visitantes estão usando o serviço AddThis no seu site.

Para maiores informações sobre o serviço AddThis, e como abrir uma conta, clique no botão [image] para acessar o website oficial www.addthis.com.

A seção Blocos laterais fornece um resumo com o Título, Tipo e Largura dos blocos na barra de ferramentas lateral, e os comandos para criar a lista de blocos:

§Adicionar...: abre Bloco lateral onde você pode adicionar um novo bloco.

§Duplicar: você pode copiar o bloco selecionado.

§Remover: você pode apagar um bloco da lista de Blocos laterais.

§Para cima / Para baixo: você pode mover o bloco selecionado uma posição para cima ou para baixo na lista Blocos laterais.

§Editar...: abre a janela Bloco lateral, onde você pode editar o bloco selecionado na lista Blocos laterais.
Clique para expandir/recolher Referência: Comandos na aba Comentários

Você pode usar os comandos nesta aba para organizar os comentários feitos por visitantes como resposta às suas Postagens no Blog.

Em primeiro lugar, você deve selecionar a opção Permitir que leitores comentem no seu Blog para que os visitantes possam fazer comentários nas suas Postagens.

Então você terá que especificar o Tipo de conteúdo, escolhendo entre:

Comentar e Votar: os visitantes podem escrever um comentário e votar no website.

Comentar: os visitantes podem escrever um comentário, mas não podem votar.

Votar: os visitantes podem votar, mas não podem escrever um comentário.

As opções na seção Configurações dos comentários são:

§Modo de visualização: você pode decidir se os comentários feitos pelos visitantes serão publicados imediatamente ou se devem ser aprovados antes, usando os comandos no painel de controle online.

§Ordenar por: você pode definir a ordem cronológica dos comentários publicados, a partir do mais recente para o mais antigo, ou vice-versa.

§Exibir botão 'Abuso': selecione esta opção se desejar que seja adicionado um botão "Abuso", para que os visitantes possam denunciar conduta questionável.

§Ativar filtro 'Captcha' anti-spam: você pode adicionar o filtro Captcha anti-spam no final do formulário de comentário. Uma série de letras distorcidas é exibida em ordem aleatória e os visitantes devem copiá-las corretamente no campo fornecido para poderem enviar seu comentário.

§Estilo de votação: selecione esta opção para definir o estilo do elemento que os visitantes podem votar (por exemplo, 5 estrelas). Esta é a única opção disponível se você selecionar Votar como Tipo de conteúdo.

Você pode indicar como os dados enviados no formulário de comentários serão gravados e manipulados pelo administrador do website na seção Modo de salvar os dados:

§Subpasta no Servidor onde salvar os dados: especifique a pasta no servidor (que tenha permissão de escrita PHP) onde os dados enviados devem ser gravados. O nome da pasta no servidor principal é especificado pela opção Pasta no servidor com permissão para escrita na janela Gerenciamento de Dados . Se você não especificar uma sub-pasta, os dados serão gravados nesta pasta.

§Enviar um email para avisar que o comentário foi recebido.: será enviado um aviso por email quando novos dados chegarem.

§Email do usuário: Você deve definir alguns parâmetros para cada opção de envio:

insira o endereço do destinatário que irá receber os emails de aviso de recebimento de dados.

Os provedores normalmente dão permissão de escrita a todas as pastas no servidor: se este for seu caso, você não precisará fornecer o endereço relativo da pasta pública. Em todos os outros casos, entre em contato com seu provedor de hospedagem para obter o endereço relativo completo da pasta pública.

Você pode verificar na aba WebSite Test do painel de controle online se a pasta com permissão de escrita e quaisquer sub-pastas dentro dela de fato existem e, se existirem, se você tem permissão de escrita nelas (para poder salvar os dados).

Quando você cria um Blog, uma página Especial é criada automaticamente no Mapa e ela é denominada "Blog": selecione-a e abra a janela Propriedades da Página para definir suas principais características.

Melhores práticas:

-

Como gerenciar os comentários no Blog e no Livro de Visitas no Painel de Controle online

Maiores informações:

-

Painel de Controle Online


A janela Configurações de postagens

Blog | Configurações de postagens

Passo 4 - Configurações Avançadas > Blog >

Blog | Configurações de postagens

 Return to chapter overview
Exibir/Ocultar o texto oculto

A janela Configurações de postagens, aberta pelos comandos Adicionar... ou Editar... da janela Blog | Postagens, é para criar ou editar uma Postagem no Blog.

Esta janela tem duas abas: Básicas e Avançadas.

Clique para expandir/recolher Referência: Comandos na aba Básicas

Os comandos nesta aba são:

§Título: você pode dar um título à Postagem.

§Data de publicação: você pode selecionar a data da publicação da postagem a partir de um calendário.

§Autor: você pode nomear o autor da Postagem, digitando o nome no campo ou selecionando a partir da lista.

§Categoria: você pode escolher uma categoria para a Postagem. Assim como no campo do Autor, você pode digitar o nome de uma nova categoria ou selecionar uma já existente da lista.

§Marcador: você pode inserir uma lista de marcadores, que são uma breve descrição do principal conteúdo de uma Postagem, escrevendo uma após a outra e separando-as por vírgulas (ex: "marcador1, marcador2, marcador3, ...").

§Conteúdo: você pode escrever sua Postagem em um editor, que é o mesmo usado para o Objeto Texto.

§Legenda: você pode escrever uma breve descrição da Postagem.
Clique para expandir/recolher Referência: Comandos na aba Avançadas

Os comandos nesta seção são:

§Vídeo/Áudio associado: você pode especificar um arquivo de áudio (no formato .MP3, .WMA, .WAV, .MID, .AIF ou .M4A) ou de vídeo (no formato .MP4, .FLV, .AVI, .WMV, .MPG ou .MOV) que será associado à Postagem. Quando selecionar esta opção, um link para o arquivo de áudio/vídeo é criado automaticamente no final da Postagem.

Vídeos podem ser reproduzidos diretamente de uma Postagem se você inserir manualmente o código HTML quando redigir o texto da Postagem no editor.

Por exemplo, você pode copiar o código de um vídeo no YouTube™ e colá-lo diretamente no corpo da Postagem.

§Fontes de informação: você pode criar uma lista de fontes que tenham sido usadas para ajudá-lo a redigir sua Postagem, usando os seguintes comandos:

-Adicionar... / Remover: você pode adicionar uma nova fonte ou remover a selecionada.

-Para cima / Para baixo: você pode selecionar uma fonte e movê-la uma posição para cima ou para baixo na lista.

-Editar: você pode editar a fonte selecionada. Você também pode clicar duas vezes em uma fonte da lista para editá-la. Para inserir uma fonte corretamente, escreva o nome do site seguido por sua URL entre os caracteres < > (por exemplo "WebSite X5 <http://www.websitex5.com>"): o texto será exibido como sendo a fonte e a URL será usada para criar um link até ela.

§Não permitir que usuários adicionem comentários: se você selecionar esta opção, os visitantes não poderão fazer comentários na Postagem em questão.

Melhores práticas:

-

Como gerenciar os comentários no Blog e no Livro de Visitas a partir do Painel de Controle Online

Maiores informações:

-

O Painel de Controle Online


A janela Bloco lateral

Blog | Bloco lateral

Passo 4 - Configurações Avançadas > Blog >

Blog | Bloco lateral

 Return to chapter overview
Exibir/Ocultar o texto oculto

A janela Bloco lateral se abre a partir dos comandos Adicionar e Editar na janela Blog | Layout, e você pode começar a definir os blocos, que contêm ferramentas úteis para os visitantes, e que ficam na coluna à direita em todas as páginas do Blog.

Esta janela tem as abas Geral e Estilo.

Clique para expandir/recolher Referência: Comandos na aba Geral

Use os comandos nesta aba para criar a lista de blocos que completam sua página do Blog.

Há diferentes tipos de blocos para escolher:

Postagens recentes: Este bloco exibe todas as Postagens recentes que tenham sido publicadas neste Blog. Um visitante pode clicar em um título para ir para a Postagem.

Categorias: Este bloco contém uma lista das categorias nas quais você organizou suas Postagens. Um visitante pode clicar em uma categoria para exibir a lista das Postagens nela.

Postagens por mês: Este bloco contém a lista das Postagens que tenham sido publicadas a cada mês.

Nuvens: Este bloco contém a lista das cagetorias ou marcadores associados às Postagens publicadas. Os nomes das categorias e dos marcadores são escritos em tamanhos de fonte diferentes, dependendo de quantas postagens estiverem associadas a eles: quanto maior a fonte, mais Postagens há. Um visitante pode clicar em uma categoria ou marcador para ver a lista das Postagens associadas.

Lista de Blogs: Este bloco exibe a lista de websites ou Blogs que você acha que podem interessar aos seus visitantes.

Facebook: Este bloco usa o plugin "Curtir" do Facebook. Os visitantes podem:

§ver quantas pessoas e/ou amigos que curtiram a página no Facebook;

§ler as Postagens publicadas recentementes na página no Facebook;

§dizer que curtiram a página no Facebook sem ter que, de fato, visitar a página.

Anúncios Google AdSense: Este bloco serve para exibir anúncios que façam parte do circuito do Google AdSense™.

Código HTML: Este bloco é livre para ser personalizado como você quiser. Você pode adicionar qualquer recurso que o Programa não adicione automaticamente.

As opções disponíveis dependem do tipo de bloco. As seguintes opções estão disponíveis para todos os tipos:

§Título: você pode especificar o título do bloco.

§Largura: você pode especificar a largura do bloco em pixels.

As seguintes opções são específicas para cada tipo de bloco:

Postagens recentes / Categorias /

Postagens por mês:

§Número máximo de itens: você pode especificar o número máximo de itens que podem ser exibidos no bloco.

Nuvens:

§Mostrar Categorias em nuvem / Mostrar Marcadores em nuvem: você pode especificar se o bloco Nuvens exibirá as categorias ou os marcadores para as Postagens que já tiverem sido publicadas.

Lista de Blogs:

§Lista de blogs: você pode montar uma lista de websites amigos com estes comandos:

-Adicionar / Remover: para adicionar um novo website amigo, ou para remover o selecionado.

-Para cima / Para baixo: você pode alterar a ordem da lista, movendo o item selecionado para uma posição diferente para cima ou para baixo.

-Editar: você pode editar o item selecionado. Você também pode clicar duas vezes em um item para editá-lo.

Para inserir um website amigo corretamente, escreva o nome do site seguido por sua URL entre os caracteres < > (por exemplo "WebSite X5 <http://www.websitex5.com>"): o texto será exibido como sendo a fonte e a URL será usada para criar um link até ela.

Facebook:

§URL do Facebook: você pode especificar a URL da página no Facebook que deseja divulgar.

§Cor do fundo: você pode escolher entre um fundo claro ou um escuro.

§Altura: você pode selecionar a altura do bloco em pixels.

§Exibir Amigos: selecione esta opção se quiser que as fotos do perfil dos amigos sejam exibidas (funcionam também como links para suas páginas no Facebook).

§Exibir Interações: selecione esta opção para exibir neste bloco as Postagens mais recentes no mural da página no Facebook que está sendo divulgada.

§Exibir Cabeçalho do FaceBook: selecione esta opção para exibir um cabeçalho do facebook no bloco.

Anúncios Google AdSense:

§Código HTML do Google AdSense: copie o código HTML do Google AdSense™ para exibir anúncios neste bloco.

Código HTML:

§Cógigo HTML: escreva ou copie um código HTML para criar seu próprio conteúdo neste bloco.
Clique para expandir/recolher Referência: Comandos na aba Estilo

Você pode usar os comandos nesta seção pra definir a aparência dos blocos na página do seu Blog.

As opções para Texto:

§Fonte: especifique a fonte, o estilo e o tamanho a ser usado no texto.

§Cor do texto: especifica a cor que será usada no texto.

§Margem: define a largura, em pixels, da margem (o espaço entre a borda do bloco e o texto).

As opções para o Fundo são:

§Cor do fundo: indica a cor a ser usada como plano de fundo.

§Arquivo de imagem: indica o arquivo (.JPG, .GIF, .PNG.) da imagem a ser usada como plano de fundo.

§Repetir: indica se a imagem do plano de fundo da página deverá ser repetida ou não. Ela pode ser repetido horizontal, verticalmente ou em ambas direções (ladrilho) para ocupar todo o espaço disponível. A imagem do plano de fundo também pode ser redimensionada para se ajustar ao espaço disponível.

§Alinhamento: especifica como a imagem de fundo deverá ficar alinhada no bloco.

As opções para Borda são:

§Espessura: a espessura das bordas (cada uma pode ser definida individualmente).

§Cor: a cor das bordas (novamente, cada borda pode ser colorida individualmente).

§Cantos arredondados: o grau de arrendondamento dos cantos (cada um pode ser definido individualmente).

§Sombra: uma sombra, especificando sua cor, posição, difusão e tamanho.

Melhores práticas:

-

Como gerenciar os comentários no Blog e no Livro de Visitas a partir do Painel de Controle Online

Maiores informações:

-

O Painel de Controle Online


RSS Feed

Passo 4 - Configurações Avançadas >

RSS Feed

 Return to chapter overview
Exibir/Ocultar o texto oculto

Esta janela oferece as ferramentas e opções para criar um RSS feed, que é um dos formatos mais populares para divulgar conteúdo na web.

Um RSS feed é um instrumento muito versátil para divulgar notícias, fotos ou vídeos. É útil para divulgar notícias regularmente, ou para anunciar eventos , atualizações em um website, novas Postagens ou comentários em um Blog.

Os visitantes que assinam um RSS feed em um website receberão constantes atualizações e notícias através do seu programa de leitura de notícias.

Clique para expandir/recolher Referência: Comandos para criar um RSS feed

Para criar um RSS feed, você precisa especificar alguns poucos parâmetros gerais e criar a lista de artigos que deseja divulgar.

A Lista de postagens exibe uma tabela que resume os artigos existentes, fornecendo o Título e a Data em que foram publicados. Os comandos para trabalhar na lista de Postagens são:

§Adicionar...: abre a janela Configuração de postagem onde você pode adicionar uma nova Postagem.

§Remover: você pode remover uma Postagem da Lista de postagens.

§Editar...: abre a janela Configuração de postagem onde você pode editar a Postagem selecionada na Lista de postagens.

Além de criar a lista de Postagens, você também pode definir as seguintes Configurações Gerais:

§Título: (parâmetro obrigatório) para dar um título ao RSS feed associado ao website.

§Imagem: você pode especificar uma imagem (usando um arquivo no formato .JPG, .GIF ou .PNG) para ser associada ao RSS feed: esta imagem (normalmente o logo da empresa ou do site) será exibida pelo programa de leitura de notícias.

§Descrição: (parâmetro obrigatório) para dar uma descrição ao RSS feed associado ao website.

Quando você testa seu website, aparece uma mensagem para lembrar você que os RSS feeds só serão exibidos quando o website tiver sido publicado na Internet.


A janela Configuração de postagem

RSS Feed | Configuração de postagem

Passo 4 - Configurações Avançadas > RSS Feed >

RSS Feed | Configuração de postagem

 Return to chapter overview

A janela Configuração de postagem é aberta pelos comandos Adicionar... e Editar... na janela RSS Feed, e você pode criar ou editar uma Postagem de RSS feed.

§Título: você pode dar um título à Postagem.

§Data de publicação: você pode selecionar a data da publicação da postagem a partir de um calendário.

§Conteúdo: você pode escrever sua Postagem em um editor, que é o mesmo usado para o Objeto Texto.

§Página vinculada: você pode especificar a página a ser associada à Postagem no mapa do site.


Gerenciamento de Dados

Passo 4 - Configurações Avançadas >

Gerenciamento de Dados

 Return to chapter overview
Exibir/Ocultar o texto oculto

Nesta janela você pode definir como os dados enviados devem ser tratados. Você pode receber tais dados a partir de Formulários de email, do Blog, do Livro de Visitas.

Você pode usar os comandos na seção Banco de Dados para criar uma lista dos bancos de dados vinculados ao seu website, para facilitar o gerenciamento dos dados. Todos os bancos de dados que você incluir serão exibidos em uma tabela que informa a Descrição, Nome do banco de dados, Nome do Host e o Login.

Clique para expandir/recolher Referência: Comandos para criar a lista de bancos de dados

Os comandos para criar a lista de bancos de dados que estão vinculados ao projeto atual são:

§Adicionar...: abre a janela Configurações do Banco de dados, onde você pode adicionar um novo banco de dados.

§Remover: você pode remover da lista o banco de dados selecionado.

§Editar...: abre a janela Configurações do Banco de dados, onde você pode editar os dados no banco de dados selecionado. Você também pode clicar duas vezes no nome de um banco de dados para editá-lo.

Você deve criar a lista de bancos de dados vinculados ao projeto antes de poder usar um banco de dados para armazenar os dados enviados via Objeto Formulário de Email.
Clique para expandir/recolher Referência: Opções para enviar emails e salvar dados no servidor

Você pode usar as opções na seção Enviar email para indicar como os emails deverão ser enviados:

§Script para envio do formulário de email: você pode especificar o script a ser usado para os emails enviados pelo WebSite X5, por exemplo, no objeto formulário de email ou no carrinho de compras. O script completo é usado por padrão: se esse script não funcionar com as configurações do servidor, substitua-o e configure as opções do servidor para um script de baixa qualidade ou de baixo nível.

§Método de envio de dados do Formulário de email: esta opção define como os dados do objeto formulário de email devem ser enviados. O método POST é usado por padrão, mas alguns servidores podem não dar suporte a ele, então é possível usar o método GET.

O protocolo HTTP (Hypertext Transfer Protocol) é o método mais comum adotado para transmitir informações na Internet. O protocolo funciona na base de solicitação/resposta: o cliente envia uma solicitação e o servidor envia uma resposta. O cliente geralmente é um navegador e o servidor é o que hospeda o website.

As mensagens HTTP de solicitação/resposta têm sua própria sintaxe. Mensagens de solicitação devem especificar o método de envio: os mais comuns são POST e GET.

O método GET é usado para obter o conteúdo do recurso indicado como assunto da solicitação (por exemplo, solicitando o conteúdo de uma página na web).

O método POST é usado para enviar informações para o servidor (por exemplo, dados em um formulário).

O mais correto é usar o método POST para emails, mas se este método não for suportado pelo servidor, então o WebSite X5 permite que você use o método GET no lugar dele.

Você também pode especificar a Pasta com permissão de escrita:

§Pasta no servidor com permissão para escrita: insira o endereço relativo no servidor para a pasta com permissão de escrita (onde o script em PHP poderá escrever).

Os provedores normalmente dão permissão de escrita a todas as pastas no servidor: se este for seu caso, você não precisará fornecer o endereço relativo da pasta pública. Em todos os outros casos, entre em contato com seu provedor de hospedagem para obter o endereço relativo completo da pasta pública.

Você pode verificar na aba WebSite Test do painel de controle online se a pasta com permissão de escrita e quaisquer sub-pastas dentro dela de fato existem e, se existirem, se você tem permissão de escrita nelas (para poder salvar os dados).


A janela Configurações do Banco de dados

Configurações do Banco de dados

Passo 4 - Configurações Avançadas > Gerenciamento de Dados >

Configurações do Banco de dados

 Return to chapter overview

Esta janela se abre com o comando Adicionar... na janela Gerenciamento de Dados, e você pode definir as configurações para um novo banco de dados que será vinculado ao projeto atual.

As Configurações do Banco de dados que você precisará especificar são:

§Descrição: dê um nome ao banco de dados para que você possa identificá-lo mais facilmente.

§Nome do Host: insira o endereço URL do servidor de SQL onde o banco de dados está armazenado online. O banco de dados geralmente é armazendao no mesmo servidor que hospeda o website e é vinculado a ele, então geralmente se usa "localhost". Verifique com o seu provedor de hospedagem se o banco de dados e o website ficam no mesmo servidor.

§Nome do banco de dados: insira o nome do banco de dados no qual deseja trabalhar (você pode obter esta informação com o seu provedor de hospedagem).

§Login: insira o nome de usuário - username (que seu provedor de hospedagem irá lhe fornecer) necessário para acessar o banco de dados online.

§Senha: insira a senha (que seu provedor de hospedagem fornecer) necessária para acessar o banco de dados online.


Gerenciamento do acesso

Passo 4 - Configurações Avançadas >

Gerenciamento do acesso

 Return to chapter overview
Exibir/Ocultar o texto oculto

Esta janela contém os comandos para criar e gerenciar o perfil dos usuários que terão acesso à Área Reservada do seu site. As páginas na Área Reservada são definidas como Páginas Protegidas quando estiver trabalhando no Criação do mapa.

Clique para expandir/recolher Referência: Comandos para criar perfis de usuários

Na seção Grupos e Usuários que podem acessar as páginas protegidas, você verá uma tabela com a lista de grupos/usuários para quem um perfil já tenha sido criado, e o nome de login e observações para cada usuário.

Os comandos para criar a lista de grupos e usuários com acesso às páginas protegidas são exibidos ao lado da tabela:

§Novo Grupo: você pode criar um novo grupo: se você organizar usuários similares em grupos, será mais fácil gerenciar. Grupos não têm configurações próprias: eles são simplemente "recipientes" e são adicionados diretamente à tabela. Dê um duplo clique em um grupo se quiser alterar seu nome.

Você às vezes poderá achar mais fácil organizar usuários se dividi-los em sub-grupos. Não há limite para a quantidade de grupos e sub-grupos que poderá criar.

Dois grupos já estão presentes na lista, por padrão: Administradores e Usuários. O grupo Adiministradores inclui os Administradores do site e eles têm acesso a todas as Páginas Protegidas do seu website.

Todos os usuários no grupo Administradores podem usar seu login e senha para acessar o Painel de Controle (que fica na URL http://www.meusite.com.br/admin onde http://www.meusite.com.br é a URL do seu website) Lá eles podem organizar comentários sobres as Postagens no Blog, as mensagens deixadas no Livro de Visitas e ver informações de diagnóstico.

§Novo Usuário: este comando abre a janela Configurações de Usuário onde você pode adicionar um novo usuário ao grupo selecionado e dar-lhe um login e uma senha.

§Criar Apelido: você pode criar um Apelido para o usuário selecionado. Esta opção é útil quando um usuário precisa ser adicionado a mais de um grupo, para ter acesso a diferentes páginas protegidas. Esta opção não fica disponível para usuários do grupo Administradores porque eles já têm acesso a todas as páginas protegidas. O Apelido permanece associado ao usuário de modo que quaisquer alterações aplicadas a um serão aplicadas ao outro. Você também pode criar um Apelido selecionando um usuário em um grupo e arrastando o nome para outro grupo. Antes de liberar o botão do mouse para soltar o nome no segundo grupo, pressione a tecla CTRL.

§Remover: você pode remover o grupo ou usuário selecionado. Você não pode remover o grupo Administradores ou o usuário Admin dentro dele.

§Editar...: este comando abre a janela Configurações de Usuário onde você pode alterar as configurações para o usuário selecionado.

Quando tiver criado os usuários com seus logins e senhas, e organizado-os em grupos, você poderá voltar para o Passo 2 - Criação do mapa para definir as páginas a serem protegidas e indicar os grupos/usuários que poderão acessar cada uma delas.
Clique para expandir/recolher Referência: Opções para gerenciamento de acesso

As seguintes opções estão disponíveis na seção Configurações da página de Login e Senha:

§Mensagem de boas-vindas: você pode redigir uma mensagem que será exibida quando um usuário tentar acessar uma página protegida sem efetuar o login antes. O usuário será redirecionado à página que o Programa cria automaticamente e que contém o seguinte:

-a mensagem de boas-vindas que você define aqui;

-os campos de login e senha;

-o botão de Registrar-se, se você incluir uma Página de Cadastro (veja abaixo).

§Página de Cadastro: esta opção leva ao Mapa do site e você poderá especificar qual página será exibida quando o usuário clicar no link para Registrar-se para inserir seu login e senha para acessar as páginas protegidas.

Quando você tiver definido pelo menos uma página como Protegida (definindo assim uma Área Reservada) uma página especial chamada "Página de Login" é criada automaticamente no Mapa e você poderá selecioná-la e usar as opções na janela Propriedades da Página para definir suas principais características.

Quando você testa seu website offline, uma mensagem de alerta avisa que as páginas protegidas serão exibidas sem solicitar acesso. A Área Reservada só fica totalmente operacional depois que o site for publicado no servidor.

Para que a Área Reservada funcione corretamente, o servidor de hospedagem tem que suportar linguagem PHP e sessões. Você pode obter esta informação no diagnóstico do servidor, na aba Website Test no Painel de Controle online.

Maiores informações:

-

O Painel de Controle Online


A janela Configurações de Usuário

Configurações de Usuário

Passo 4 - Configurações Avançadas > Gerenciamento do acesso >

Configurações de Usuário

 Return to chapter overview

A janela Configurações de Usuário se abre quando você seleciona os comandos Novo Usuário ou Editar... na janela Gerenciamento do acesso, e você poderá configurar o login e a senha para um novo usuário.

Os comandos para criar um novo usuário são:

§Nome e Sobrenome: insira o nome do usuário que terá acesso a determinadas Páginas Protegidas no website.

§Login / Senha: insira um nome de login e a senha par ao novo usuário, que ele usará para acessar as Páginas Protegidas às quais terá acesso. Uma senha de 8 caracteres é gerada automaticamente: ela pode ser alterada.

§Página de acesso: esta opção leva ao Mapa do site e você pode especificar a página a ser exibida depois que o usuário tiver fornecido seu login e senha.

§Observação: é um campo opcional: você pode acrescentar observações sobre o usuário.

§Data de cadastramento: exibe um calendário para que você possa indicar a data em que o novo usuário foi cadastrado.

As informações nas opções Observação e Data de cadastramento não são adicionadas ao código do website: seu único propósito é facilitar a tarefa de gerenciamento de usuários para o Administrador do website.


Carrinho de compras

Passo 4 - Configurações Avançadas >

Carrinho de compras

 Return to chapter overview
Exibir/Ocultar o texto oculto

Esta janela contém as ferramentas e opções para criar e organizar uma loja virtual no carrinho de compras, onde você poderá vender produtos online no seu website.

A primeira coisa a fazer quando criar uma loja virtual é definir o catálogo de produtos, organizando os produtos nas categorias e sub-categorias apropriadas. Você precisará inserir algumas informações básicas para cada produto, como seu nome, descrição e preço. Você pode, no entanto, adicionar maiores detalhes, por exemplo, fotografias, variações de cor, tamanho e modelo, etc. Quando tiver criado seu catálogo de produtos, você poderá especificar os métodos de envio e de pagamento e compor o formulário de pedido, incluíndo os emails enviados pelo objeto carrinho de compras para o Administrador do website e para os consumidores que fizerem um pedido de compra.

As opções para definir os diversos elementos na loja virtual, e como eles funcionam, estão organizadas nas seguintes abas: Produtos, Gerenciamento de Pedidos, Dados do cliente, Enviar pedido e Opções.

Clique para expandir/recolher Referência: Comandos na aba Produtos

Você pode usar os comandos nesta aba para adicionar produtos ao carrinho de compras, organizados em categorias.

Todos os produtos que tenham sido adicionados são listados em uma tabela, dentro das suas categorias. A tabela fornece sua Descrição e o Preço de cada um.

A barra de ferramentas no alto da tabela contém os seguintes comandos:

Cortar [CTRL+X] - Copiar [CTRL+C] - Colar [CTRL+V]

Estes comandos cortam, copiam e colam os produtos selecionados. Os mesmos comandos também ficam disponíveis a partir do menu popup que é exibido quando você clica na lista de produtos com o botão direito do mouse.

Expandir / Recolher

Você pode expandir e recolher a categoria selecionada para ver/ocultar os produtos que estão nela.

Importar Produtos

Você pode importar a lista de produtos a ser adicionada ao carrinho de compras diretamente de um arquivo externo (no formato .TXT ou .CSV a partir do Microsoft Excel).

Exportar Produtos

Você pode exportar o catálogo de produtos para um arquivo .TXT ou .CSV.

Para maiores informações sobre os recursos Importar Produtos/Exportar Produtos, e sobre como criar e organizar arquivos no catálogo de produtos, veja Como importar/exportar produtos no carrinho de compras.

Os seguintes comandos também ficam disponíveis para criar a lista de produtos no carrinho de compras da loja virtual:

§Nova Categoria: você pode adicionar uma nova categoria para os produtos. Categorias não têm nenhuma configuração específica: elas são simples "recipientes" e são adicionados diretamente à tabela quando são criados. Você pode dar um duplo-clique na tabela para renomear uma categoria.

Você também pode criar sub-categorias. Não há limite para a quantidade de categorias e sub-categorias que poderá criar.

§Novo Produto: este comando abre a janela Configurações do Produto onde você pode adicionar um novo produto à categoria selecionada.

§Remover: você pode remover a categoria selecionada e todos os produtos dentro dela, ou você pode selecionar produtos individualmente para remover.

§Editar...: este comando abre a janela Configurações do Produto onde você pode alterar as configurações para o produto selecionado.

Você pode mover um produto para uma categoria diferente na lista de produtos: selecione o produto e arraste & solte em outra categoria. Use as teclas CTRL e SHIFT para selecionar mais de um produto.

Quando tiver adicionado as categorias e produtos ao carrinho de compras da loja virtual, você poderá usar o Objeto Lista de Produtos para criar o catálogo online.
Clique para expandir/recolher Referência: Comandos na aba Gerenciamento de Pedidos

Você pode usar os comandos nesta seção para definir as formas de envio e de pagamento para seu carrinho de compras online.

A Lista de Tipos de Envio exibe as formas de envio já adicionadas, e mostra o Nome, a Descrição e o Custo para cada uma delas.

Os comandos para criar a lista de formas de envio são:

§Adicionar...: abre a janela Tipo de Envio e você pode definir uma nova forma de envio.

§Duplicar: você pode fazer uma cópia da forma de envio selecionada, para usar como base para definir uma nova forma.

§Remover: você pode remover a forma de envio selecionada.

§Para cima / Para baixo: você pode alterar a ordem em que as formas de envio aparecem na lista, movendo o método selecionado para uma nova posição acima ou abaixo.

§Editar...: este comando abre o Tipo de Envio e você pode editar a forma de envio selecionado. Você também pode fazer isso dando um duplo clique em uma das formas já listadas.

A Lista de Tipos de Pagamentos é muito parecida com a lista de tipos de envio. Ela lista os modos de pagamento que já tenham sido adicionados e exibe o Nome, a Descrição e o Custo para cada um.

Os comandos para criar a lista de tipos de pagamento são idênticoa aos da lista de tipos de envio, mas você também tem dois botões, Adicionar... e Editar... que abrem a janela Tipo de Pagamento.
Clique para expandir/recolher Referência: Comandos na aba Dados do cliente

Você pode usar os comandos nesta aba para compor um formulário de pedido de compra para seu carrinho de compras.

A seção Formulário do Pedido exibe uma Lista de Campos com todos os campos que você pode usar no formulário de pedido de compra: alguns campos são Pré-definidas e outros são Personalizar, e a lista indica se um campo é Visível e/ou Obrigatório.

Os comandos na barra de botões acima da Lista de Campos são:

Adicionar Campo personalizado

Você pode adicionar um novo campo Personalizar ao formulário de pedio.

Remover Campo

Você pode remover o campo selecionado. Você não pode remover os campos Pré-definidas.

Renomear Campo

Você pode alterar o nome do campo selecionado. Você não pode alterar os nomes dos campos Pré-definidas.

Sposta sopra / Sposta sotto

Você pode alterar a posição dos campos na lista, movendo o campo selecionado para cima ou para baixo. Você pode alterar a ordem dos campos Pré-definidas e dos Personalizar, mas você não pode mover os campos Personalizar para a lista dos Pré-definidas, ou vice-versa.

Campo visível

Você pode definir o campo selecionado como Visível/Invisível no formulário do pedido.

Campo obrigatório

Você pode definir o campo selecionado como Obrigatório/Opcional no formulário do pedido. O cliente terá que preencher todos os campos obrigatórios para poder prosseguir com sua compra.

A lista já contém todos os campos que geralmente são usados em um formulário de pedido de compra.

O campo "Endereço de email" é o único que não pode ser definido como opcional ou oculto, porque o endereço de email do cliente é vital para o funcionamento correto do carrinho de compras.

No final da tabela Lista de Campos há esta opção:

§Exibir formulário de dados de envio: se você selecionar esta opção, uma seção especial será adicionada automaticamente ao formulário do pedido com os campos com os detalhes de endereço do comprador para o envio, se eles forem diferentes dos detalhes para o encaminhamento da fatura.

Além dos campos para coletar dados de faturamento e envio, de acordo com os requerimentos legais atuais, os formulários de pedidos também devem especificar os termos e condições que regulam as funções dos carrinhos de compra, de modo que os consumidores possam ler e aceitar de forma explícita.

Na seção Termos e Condições de Venda há um editor que você pode usar para redigir o Texto dos Termos e Condições de Venda. Um texto padrão foi incluído no editor, e você pode usar o botão [image] para criar links para abrir, por exemplo, os arquivos em .PDF que contenham sua Política de Tratamento de Dados Sigilosos e a Política de Reembolso. Se prefirir, você poderá redigir seu próprio texto.

Para cumprir com as determinações legais, basta que os Termos e Condições de Venda apareçam imediatemente antes do botão "Comprar", que confirma o pedido. Você também pode incluir a seguinte opção:

§Solicitar a confirmação dos Termos e Condições de Venda: um campo solicitando que o consumidor aceite de forma explícita os Termos e Condições de Venda é adicionado ao final do formulário de pedido, e o consumidor poderá clicar na caixa de seleção para confirmar sua aceitação dos termos.
Clique para expandir/recolher Referência: Comandos na aba Enviar pedido

Você pode usar os comandos nesta seção para definir como os dados enviados pelo formulário do pedido de compras no carrinho de compra serão tratados, e para redigir o texto dos emails de confirmação do pedido que são enviados automaticamente aos consumidores.

Você pode especificar como os dados enviados pelos formulários de pedido de compra deverão ser salvos e enviados para o Administrador do website na Ordem de envio:

§Endereço de email para recebimento de pedidos: especifica o endereço de email para o qual os dados enviados nos formulários de pedido deverão ser enviados. Pode ser fornecido mais de um endereço de email: separe os endereços de email por um ponto-e-vírgula (;).

§Anexar dados do pedido no formato CSV: dados enviados são gravados em um arquivo .CSV, adicionado no final do email. Os dados nos arquivos .CSV estão no formato texto, como uma lista de itens separados por ponto-e-vírgula (;): estes arquivos podem ser importados em programas de planilhas (ex. Microsoft Excel).

Finalmente, na seção Email de confirmação de Pedido para o cliente, você terá os campos para especificar o Texto de introdução e o Texto de encerramento para o email de confirmação do pedido que é enviado automaticamente ao comprador. Este email contém o texto de introdução, o texto de encerramento e uma descrição dos métodos de envio e pagamento escolhidos pelo comprador.
Clique para expandir/recolher Referência: Comandos na aba Opções

Você pode usar os comandos nesta aba para definir algumas configurações de aparência, moeda e impostos no carrinho de compras da loja virtual.

As seguintes opções estão disponíveis para Moeda de pagamento:

§Moeda: você pode especificar as moedas que serão aceitas no carrinho de compras. Uma lista suspensa exibe uma lista de moedas: clique no botão [image] para abrir a janela Lista de moedas e editar a lista.

§Agrupamento de dígitos: você pode especificar como os preços devem ser grafados: você pode usar o ponto como separador de milhares e uma vírgula como separador dos decimais (1.000,00) ou vice-versa (1,000.00).

§Mostrar símbolo da moeda à direita: se você selecionar esta opção, o símbolo da moeda será posicionado à direita do preço.

§Mostrar casas decimais: se você selecionar esta opção, os preços serão marcados com dois dígitos depois do separador decimal (de centavos).

As seguintes opções estão disponíveis para as Configurações do ICMS:

Tipo: especifique se os preços exibidos no carrinho de compras já incluem o valor do ICMS, não incluem o valor do ICMS ou se o imposto não se aplica ao produto em questão.

Valor padrão (%): especifique o valor do ICMS a ser adicionado por padrão a todos os produtos no carrinho de compras, com exceção dos produtos para os quais um valor diferente de ICMS tenha sido definido na opção ICMS (%) na janela Configurações do Produto | Geral.

Os seguintes comandos estão disponíveis na seção Opções:

§Permitir pedidos somente para valores acima do mínimo: se você selecionar esta opção, pedidos menores que uma quantia mínima determinada não serão aceitos.

§Valor mínimo total: esta opção fica disponível se Permitir pedidos somente para valores acima do mínimo tiver sido selecionado. Você pode definir o valor total mínimo que o pedido precisa atingir para ser aceito.Você pode usar as Opções para definir o estilo das tabelas que exibem os produtos disponíveis e/ou adicionados ao carrinho de compras:

§Fundo do Cabeçalho / Texto do Cabeçalho / Preenchimento das células / Texto das células / Borda da tabela: você pode especificar a cor dos diversos elementos na tabela de produtos.

§Cantos arredondados: você pode especificar o chanfrado para os cantos da tabela de produtos, tanto para os quatro cantos ao mesmo tempo ou individualmente.

§Alternar cor das linhas: você pode aplicar duas cores de fundo para alternarem nas linhas pares e ímpares. Uma das cores é a especificada na opção Preenchimento das células e a outra será aplicada automaticamente como um tom mais escuro. Usar cores alternadas torna as tabelas mais fáceis de ler, especialmente as mais longas.

Você pode usar os comandos na seção Imagens para adicionar imagens para as páginas do carrinho de compras:

§Adicionar ao carrinho/ Remover do carrinho: você pode especificar quais imagens deseja usar para os botões "Adicionar ao carrinho" e "Remover do carrinho".

§Sem foto: você pode especificar a imagem a ser usada quando um determinado produto não tiver uma foto associada a ele (se as opções Configurações do Produto | Imagem), e "Imagem e texto" ou "Texto e imagem" tiverem sido selecionadas como Modo de exibição fichas dos produtos em Objeto Lista de Produtos | Configurações.

Quando o carrinho de compras estiver completo, você terá que adicionar as informações e os links necessários no website para que os clientes possam ver as informações sobre os produtos e efetuar suas compras. Você pode fazer isso de duas maneiras:

1.Incluir o botão "Comprar" nas páginas de apresentação dos produtos, quando as criar, usando o link Adicionar ao carrinho (veja Link).

2.Criar as páginas de apresentação dos produtos com o Objeto Lista de Produtos para usar fichas que já inlcuem o botão "Comprar".

Quando criar um email no carrinho de compras, a página especial "carrinho de compras" é adicionada automaticamente ao Mapa: você pode selecionar a página e definir suas principais características na janela Propriedades da Página.

Quando você testa o website offline, uma mensagem de alerta avisa que o pedido não será enviado e que você será automaticamente redirecionado para a página de confirmação do pedido. O carrinho de compras da loja virtual só ficará completamente funcional depois que o website tiver sido publicado no servidor.

O servidor onde o website for publicado tem que dar suporte à linguagem PHP e o comando Mail deverá estar habilitado para que seu carrinho de compras funcione corretamente. Você pode obter estas informações no diagnóstico do servidor na aba WebSite Test (teste do Website) no Painel de Controle online.

Se tiver problema em enviar emails, é provável que o servidor que está usando não tenha uma configuração padrão. Tente alterar as definições do script e o método de envio de email, usando as opções oferecias em Configurações Avançadas | Gerenciamento de Dados. Para maiores informações, entre em contato com seu provedor de hospedagem.

Melhores práticas:

- | Como importar/exportar produtos no carrinho de compras
- | Como redigir o email de confirmação do pedido

Maiores informações:

-

O Painel de Controle Online


A janela Configurações do Produto

Carrinho de compras | A janela Configurações do Produto

Passo 4 - Configurações Avançadas > Carrinho de compras >

Carrinho de compras | A janela Configurações do Produto

Return to chapter overview
Exibir/Ocultar o texto oculto

A janela Configurações do Produto se abre quando você seleciona os comandos Novo Produto ou Editar... na aba Carrinho de compras | Produtos, e nela você pode definir e adicionar um novo produto.

A janela é organizada nas seguintes abas: Geral, Imagem, Opções, Desconto.

Clique para expandir/recolher Referência: Comandos na aba Geral

Você pode usar os comandos nesta aba para fornecer as informações básicas sobre um novo produto a ser adicionado ao Carrinho de compras.

As opções para definir um novo produto são:

§Nome/Código: você pode dar um nome ou um código ao produto.

§Descrição: você pode escrever uma descrição do produto.

§Preço: você pode especificar o preço do produto.

§ICMS (%): se você selecionar esta opção, poderá especificar a taxa de imposto (ICMS) a ser aplicada ao produto. Esta opção fica disponível se você tiver configurado o Tipo como "ICMS incluído" ou "ICMS excluído" como Configurações do ICMS em Carrinho de compras | Opções.

Dependendo de como você deseja organizar seu carrinho de compras, você pode adicionar produtos com preços que já incluem o imposto ou você pode orçar preços sem o imposto, o que é útil para artigos que têm uma taxa de ICMS específica a ser aplicada, e adicionar o imposto separadamente a cada produto.

§Peso: insira o peso do produto atual, de modo que os custos de envio possam ser calculados corretamente (veja A janela Tipo de Envio).

Dependendo do tipo de produto que deseja adicionar ao carrinho, você pode usar a opção Peso para expressar o peso em kilogramas ou em gramas, litros, metros cúbicos, ou qualquer outra unidade de medida. O custo do envio precisa ser calculado corretamente, portanto é importante escolher a unidade de medida mais apropriada e aplicá-la a todos os produtos no carrinho de compras.

§Link (ex: Página do Produto): esta opção abre a janela Link onde você pode especificar um link para o produto em questão. O link poderia ser, por exemplo, a página do site que apresenta o produto em detalhes.
Clique para expandir/recolher Referência: Comandos na aba Imagem

Você pode usar os comandos nesta aba para adicionar fotos a um produto no Carrinho de compras.

Você pode importar várias fotos para criar uma Apresentação de slides do produto: quando os visitantes clicarem em cada foto, uma versão ampliada será exibida na ShowBox.

Somente a primeira foto associada a um produto será exibida no carrinho. As outras fotos podem ser vistas na ficha do produto, se você criar uma usando a Objeto Lista de Produtos.

As opções para criar a lista de fotos associadas a um produto são:

§Adicionar... / Remover...: você pode adicionar fotos ou remover as selecionadas na lista que compõe a Apresentação de slides. Você pode selecionar vários arquivos ao mesmo tempo na janela que se abre.

§Para cima / Para baixo: você pode alterar a ordem das fotos adicionadas à Apresentação de slides, movendo a foto selecionada pra cima ou para baixo para ocupar uma nova posição na lista.

§Editar...: esta opção abre o Editor de imagens onde você pode editar a foto selecionada.

As seguintes opções estão disponíveis na seção Propriedades da ShowBox:

§Tamanho máximo:: você pode especificar a largura/altura máximas da Showbox onde as versões ampliadas das fotos são exibidas. Deixe o Manter proporções selecionado para manter a proporção entre a largura e a altura.

§Efeito: clique no botão [image] para abrir a janela Propriedades do efeito onde poderá definir os efeitos de transição para as fotos no Showbox.

Você pode personalizar o estilo da Showbox: use as opções na seção Estilos e Modelos | Email do Passo 4 - Configurações Avançadas , você pode definir cores, sombras, opacidade, efeitos de entrada, etc.
Clique para expandir/recolher Referência: Comandos na aba Opções

Você pode usar os comandos nesta aba para criar a lista de opções que ficam disponíveis para um novo produto que estiver adicionando ao Carrinho de compras.

As principais opções de um produto são, por exemplo, o tamanho, cor e modelos alternativos do mesmo produto. Cada opção pode ter sub-opções. Por exemplo, a "Camiseta XY" pode ter como principais opções de tamanho "P", "M" e "G": as sub-opções para "P" podem ser "Preta", "Vermelha" e "Verde". As sub-opções pra "M" pdem ser "Preta" e "Branca", e assim por diante.

Os compradores podem ver uma lista completa das opções disponíves no carrinho de compras e/ou nas fichas dos produtos criadas pelo Objeto Lista de Produtos, e selecionar a que desejam comprar.

Os comandos para criar a Lista de Opções Principais são:

§Adicionar...: você pode adicionar a nova opção principal para o produto em questão. Ela será exibida na Lista de Opções Principais e você poderá defini-la usando as opções na seção Configurções da Opção Principal.

§Remover...: você pode remover a opção principal selecionada da Lista de Opções Principais.

§Para cima / Para baixo: você pode alterar a ordem das principais opções na lista, movendo a opção selecionada para cima ou para baixo.

Você pode definir as principais opções em Configurções da Opção Principal:

§Nome/Código: dê um nome ou um código para a principal opção que estiver criando para o produto em questão.

§Diferença de Preço: especifique a variação de preço para a principal opção, em relação ao Preço do produto conforme indicado na aba Geral.

§Diferença de Peso: especifique a variação de peso para a opção principal, em relação ao Peso do produto conforme indicado na seção Geral.

Clique para expandir/recolher Referência: Comandos na aba Desconto

Você pode usar os comandos nesta aba para definir um desconto para um novo produto no Carrinho de compras.Se você marcar a opção Habilitar desconto por quantidade, você pode criar uma lista dos descontos a serem aplicados de acordo com a quantidade de produtos comprados. Estes descontos por atacado são exibidos em uma lista, e os comandos para criá-los são:

§Adicionar...: este comando abre a janela Desconto por quantidade, e você pode adicionar um desconto por quantidade para o produto em questão. Você pode definir a Quantidade do produto, e a quantidade escolhida pelo comprador deverá igual ou maior que a quantidade indicada aqui para ser aplicado o Desconto (%).

§Remover: você pode remover o desconto por quantidade selecionado da lista.

§Editar...: este comando abre a janela Desconto por quantidade, onde você poderá alterar o desconto por quantidade selecionado. Você também pode dar um duplo clique sobre o desconto para editá-lo.


A janela Tipo de Envio

Carrinho de compras | A janela Tipo de Envio

Passo 4 - Configurações Avançadas > Carrinho de compras >

Carrinho de compras | A janela Tipo de Envio

Return to chapter overview
Exibir/Ocultar o texto oculto

A janela Tipo de Envio, que se abre quando você seleciona o comando Adicionar... ou Editar... na seção Lista de Tipos de Envio em Carrinho de compras | Gerenciamento de Pedidos, permite que você defina as formas de envio para os produtos no carrinho de compras.

A janela Tipo de Envio é organizada nas seguintes abas: Geral, Custo e Mensagem de email.

Clique para expandir/recolher Referência: Comandos na aba Geral

Você pode usar estes comandos para definir uma forma de envio:

§Nome: dê um nome curto e claro para esta forma, de modo que você possa identificar facilmente depois.

§Descrição: você pode dar uma explicação completa para a nova forma.

§Imagem: selecione a imagem que será exibida no carrinho de compras junto a esta forma.
Clique para expandir/recolher Referência: Comandos na aba Custo

Você pode usar os comandos nesta aba para indicar quaisquer sobretaxas para a forma de envio em questão. Tais custos podem ser aplicados em uma das seguintes maneiras:

§Custo Fixo: você pode especificar um custo fixo de envio para a forma atual. O custo permanece fixo, independente do peso total ou do valor total da compra.

§Custo relativo ao valor do Pedido: você pode definir uma faixa de valores de custo de envio, que dependem do valor total da compra. Os botões Adicionar... e Editar... abrem a janela Custo de Envio, onde você pode definir o valor Total do pedido a ser atingido ou ser maior que, para aplicar o envio especificado Preço.

§Custo relativo ao Peso Total: você pode definir uma faixa de valores de custo de envio para a forma de envio em questão, dependendo do peso total dos produtos no pedido. Os botões Adicionar... e Editar... abrem a janela Custo de Envio, onde você pode definir o Peso Total a ser atingido ou ser maior que para aplicar o Custo de envio especificado.

Para um cálculo correto do custo de envio, certifique-se de ter especificado o peso de cada produto no carrinho de compras na janela Configurações do Produto | Geral.

Você também pode usar esta opção:

§ICMS (%): se selcionada, você pode especificar o imposto (ICMS) a ser aplicado à forma de envio. Esta opção fica disponível se você tiver configurado o Tipo como "ICMS incluído" ou "ICMS excluído" como Configurações do ICMS em Carrinho de compras | Opções.
Clique para expandir/recolher Referência: Comandos na aba Mensagem de email

Você pode usar o campo nesta aba para adiconar um texto explicativo sobre a forma de envio. Preste atenção a como redigirá este texto, porque ele será adiconado ao email de confirmação do pedido que é enviado ao comprador.

Melhores práticas:

-

Como redigir um email de confirmação do pedido


A janela Tipo de Pagamento

Carrinho de compras | A janela Tipo de Pagamento

Passo 4 - Configurações Avançadas > Carrinho de compras >

Carrinho de compras | A janela Tipo de Pagamento

 Return to chapter overview
Exibir/Ocultar o texto oculto

A janela Tipo de Pagamento é aberta pelos comandos Adicionar... ou Editar... na Lista de Tipos de Pagamentos na Carrinho de compras | Gerenciamento de Pedidos, e você pode adicionar as formas de pagamento para o carrinho de compras.

A janela Tipo de Pagamento tem as seguintes abas: Geral, Tipo e Mensagem de email.

Clique para expandir/recolher Referência: Comandos na aba Geral

Você pode usar estes comandos para adicionar uma nova forma de pagamento:

§Nome: dê um nome curto e claro para esta forma, de modo que você possa identificar facilmente depois.

§Descrição: você pode dar uma explicação completa para a nova forma.

§Imagem: selecione a imagem que será exibida no carrinho de compras junto a esta forma.
Clique para expandir/recolher Referência: Comandos na aba Tipo

Você pode usar os comandos nesta aba para escolher a forma de pagamento, que pode ser:

§Pagar mais tarde: o comprador pode enviar um pedido de ocmpra e pagar mais tarde (por exemplo, fazendo uma transferência bancária).

§Pagar agora: o comprador pode enviar o pedido de compra e pagar imediatamente (por exemplo, via PayPal™, ou outros meios semelhantes, ou por cartão de crédito).

Se você selecionar a opção Pagar agora, você precisa definir o Tipo de Pagamento solicitado; cada tipo exige determinados parâmetros:

PayPal/Cartão de Crédito

§Conta PayPal: os detalhes da sua conta no PayPal™ devem ser inseridos.

§Página de confirmação do pagamento: você pode selecionar a página no site que será exibida para confirmar o pagamento.

§Página de erro no pagamento: você pode selecionar a página no mapa do site que deverá ser exibida se ocorrer algum erro durante o pagamento.

Código personalizado

§Código HTML para o botão 'Pagar agora': se você usar uma forma alternativa ao PayPal™, você deverá inserir o código HTML fornecido pelo serviço de pagamento neste campo.

O código HTML do provedor do serviço de pagamento é usado para criar o botão "Comprar", e ele deverá incluir o código do produto e seu preço. Você precisa inserir as seguintes tags manualmente no código, senão o carrinho de compras não funcionará corretamente:

§[ORDER_NO] - o número do pedido será inserido aqui;

§[PRICE] - o preço será inserido aqui.

Estas opções também estão disponíveis:

§Custo: você pode especificar uma taxa de custo (se houver alguma) que será aplicada à forma de pagamento selecionada.

§ICMS (%): você pode especificar a taxa de imposto que será aplicada à forma de pagamento em questão. Esta opção fica disponível se você tiver configurado o Tipo como "ICMS incluído" ou "ICMS excluído" como Configurações do ICMS em Carrinho de compras | Opções.
Clique para expandir/recolher Referência: Comandos na aba Mensagem de email

Você pode escrever uma mensagem no campo desta aba que descreva e explique a forma de pagamento selecionada. Esta mensagem será incluída no email de confirmação do pedido que será enviado ao comprador.

Melhores práticas:

-

Como redigir um email de confirmação do pedido


Exportar

Passo 5 - Exportar >

Exportar

 Return to chapter overview

Quando tiver encerrado uma sessão de trabalho, ou tiver terminado de criar seu website, você estará pronto para prosseguir para o Passo 5, onde o WebSite X5 lhe dá a escolha de como quer exportar seu projeto. Graças ao mecanismo interno de FTP, você pode publicar os arquivos do seu projeto diretamente no servidor: conexões seguras são usadas, e você pode economizar tempo trabalhando com conexões simultâneas e publicando somente os arquivos que tenham sido alterados. Como alternativa, você pode exportar seu site para seu próprio computador, para ter uma cópia dos arquivos que serão publicados no servidor. Finalmente, todos os arquivos do projeto podem ser salvos em uma única pasta, para ser transferida para outro computador se desejar trabalhar em outro lugar.

Portanto, as opções de exportação são:

Publicar na internet

Exportar o site para pasta local

Exportar o Projeto


Exportar o site para a internet

Passo 5 - Exportar >

Exportar o site para a internet

 Return to chapter overview
Exibir/Ocultar o texto oculto

Você pode publicar seu website na Internet por esta janela.

O WebSite X5 fornece seu próprio mecanismo de FTP para que você possa publicar seus websites diretametne online. Todos os arquivos necessários para a exibição correta de um website na Internet são salvos no computador que você usou para criar o website. Você terá que copiar os arquivos do seu projeto para um servidor (um computador que fica permanentemente conectado à Internet), para que outras pessoas possam ver seu site online.

Clique para expandir/recolher Referência: Comandos para estabelecer uma conexão com o servidor

A primeira coisa a fazer quando exportar seu website é especificar os Parâmetros da conexão (são os dados fornecidos pelo se provedor de hospedagem):

§Tipo de servidor: especifique a conexão a ser usada para publicar os arquivos do website no servidor. Escolha a que seu servidor usar entre as seguintes:

-FTP - File Transfer Protocol: é a opção padrão. O FTP é um dos protocolos de transmissão de dados mais antigos e ainda é largamente utilizado. Os dados trocados entre o cliente e o servidor não são criptografados, de acordo com as especificações originas de FTP.

-SFTP - SSH File Transfer Protocol: é um protocolo de internet que garante a transferência segura dos dados, usando sessões de criptografia remota e manipulação remota de arquivo.

-FTPS - FTP sobre TLS/SSL explícito: para garantir segurança, este protocolo adiciona uma camada de criptografia SSL/TLS ao protocolo FTP, mais uma série comandos e códigos de resposta.

§Endereço FTP: insira seu endereço de FTP neste campo. Um exemplo de endereço de FTP seria "ftp.websitex5.com", onde "websitex5.com" é o nome do domínio.

§Login / Senha: insira seu nome de usuário e senha nesses campos.

§Salvar senha: se você selecionar esta opção, sua senha será salva e você não terá que inseri-la novamente no futuro.

Também há alguns Parâmetros opcionais, não estritamente necessários para estabelecer uma conexão com o servidor, mas você pode inseri-los se quiser:

§Pasta de destino: insira o endereço relativo da pasta de destino no servidor, conforme fornecido pelo provedor de hospedagem. Se você não inserir o endereço relativo aqui, poderá fazer isso na próxima janela que o WebSite X5 exibirá.

§Porta: insira o número da porta de acesso no servidor com o qual deseja estabelecer uma conexão (seu provedor de hospedagem fornecerá esta informação). Geralmente não é necessário alterar o valor padrão.

§Transferências simultâneas: insira a quantidade de conexões com o servidor em que o mecanismo interno de FTP deverá operar simultaneamente para publicar seus arquivos do site. A quantidade de conexões é equivalente ao número máximo de arquivos que podem ser exportados simultaneamente.

O servidor que você usar deverá suportar Transferências simultâneas. Apesar do suporte ser garantido, somente algumas conexões simultâneas poderão ser tratadas eficientemente. Tente começar com 3 conexões e aumentar progressivamente o número até que descubra a melhor quantidade que o servidor consegue lidar na sua largura de banda. Geralmente falando, não é aconselhável especificar mais do que 10 conexões simultâneas.

§Utilizar FTP passivo: fica ativada por padrão, e significa que o FTP passivo será usado para exportar os projetos. Ele garante maior compatibilidade de conexão com o servidor.

§Habilitar compressão gzip: fica ativada por padrão, e significa que os arquivos do projeto serão comprimidos durante o processo de exportação, reduzindo o tempo de exportação.

Nem todos os servidores suportam compressão gzip. Se esta opção estiver selecionada e seu servidor não suportar, os arquivos não serão comprimidos, mas ainda assim o projeto será publicado. A compressão Gzip funciona muito bem para arquivos grandes (que contêm uma grande quantidade de imagens, por exemplo), mas não é recomendada para arquivos pequenos.

Quando tiver configurado todos os parâmetros necessários para estabelecer uma conexão com o servidor, você poderá determinar o Modo de envio (o que e como você realmente quer publicar):

§Exportar todos os arquivos do site: todo o projeto do site é exportado e publicado. Esta opção é recomendada na primeira vez que exportar seu webiste, ou quando tiver feito muitas alterações aos arquivos do projeto.

§Exportar somente arquivos modificados desde o último envio realizado em {0}: somente os arquivos que tiverem sido modificados desde a última exportação serão transmitidos. Esta opção é recomendada para websites que passem por atualizações frequentes e leva menos tempo para completar a transmissão dos arquivos do que levaria para exportar o projeto todo.

A data de publicação é salva em um arquivo do projeto, então é importante sempre salvar as alterações antes de publicar os arquivos.

Mesmo se você optar por exportar somente os arquivos modificados, as páginas HTML e os arquivos de recursos (na pasta RES) também são exportadas, porque é bem provável que tenham sido modificadas automaticamente de alguma forma.

§Exportar apenas Blog e RSS Feed: se você selecionar esta opção, somente os arquivos .PHP e XML do Blog e os arquivos .XML do RSS feed serão publicados (veja Passo 4 - Configurações Avançadas). Você só pode selecionar esta opção se o Blog e/ou o RSS feed já tiverem sido publicados uma vez. É útil para atualizar seu Blog com novas postagens e adicionar notícias no RSS feed, quando nenhuma outra alteração tiver sido feita no website.
Clique para expandir/recolher Referência: Comandos para por o site online

Quando tiver definido todos os parâmetros, clique no botão Avançar para estabelecer uma conexão com o servidor. Quando ela tiver sido estabelecida, uma lista das pastas já existentes no servidor será exibida. Use os comandos disponíveis para mover para a pasta onde deseja publicar os arquivos do seu projeto.

A pasta onde você vai querer publicar seu website deverá conter um arquivo index.html. Se não tiver certeza qual pasta usar, pergunte ao seu provedor de hospedagem: nem todas as pastas no servidor servem para a publicação se websites.

Clique para expandir/recolher

Os comandos para trabalhar nas pastas e arquivos no servidor são:

Ir para pasta um nível acima

Leva de volta para a pasta no nível anterior.

Atualizar o conteúdo da pasta atual

O conteúdo da pasta é recarregado.

Criar nova pasta

Você pode criar uma nova pasta.

Excluir arquivo ou pasta selecionados

Você pode apagar a pasta ou o arquivo selecionado.

Renomear o arquivo ou pasta

Você pode mudar o nome da pasta ou do arquivo selecionado.

Enviar arquivo para o servidor / Baixar o arquivo selecionado no servidor.

Você pode publicar um arquivo ou mais no servidor e que não são parte do projeto, ou você pode baixar arquivos publicados no servidor para seu computador.

Exibir Lista / Exibir detalhes

Você pode escolher o nível de detalhamento da lista de arquivos.

Finalmente, há uma seção com duas outras abas:

§Log: você pode optar por exibir a mensagem do log (registro) e os erros que possam ter ocorrido durante a conexão com o servidor.

§Fila de transferência: você pode optar por exibir o status da transmissão dos arquivos sendo publicados no servidor (o número máximo de arquivos depende do número de conexões simultâneas). Uma barra de status exibe o progresso de cada transferência. Quando um arquivo tiver sido transferido, ele é removido da fila.

Ao exportar um projeto, o WebSite X5 copia todos os arquivos na pasta de registro do servidor, Se esta pasta tiver arquivos com o mesmo nome das que estiverem sendo publicadas, estas últimas serão substituídas. O WebSite X5 nunca apaga qualquer arquivo que já estiver no servidor: isto deve ser feito manualmente.


Exportação concluída

Passo 5 - Exportar > Exportar o site para a internet >

Exportação concluída

 Return to chapter overview

Quando seu site tiver sido publicado online com sucesso (veja Exportar o site para a internet), esta janela sugere algumas formas de divulgar a novidade, usando canais como a Galeria do WebSite X5, Google™, Facebook e Twitter.

As opções são:

Seu site está online!

Você pode abrir seu navegador de internet padrão para visitar seu site e verificar se tudo funciona corretamente.

WebSite X5 Gallery

Você pode acessar a Galeria do WebSite X5 Answers para enviar seu novo website. A Gallery é uma coleção de websites criados usando o WebSite X5 e enviados por seus autores.

Atualizar o SiteMap no Google

Você pode informar ao Google™ sobre seu SiteMap recém-pubicado, para que o mecanismo de busca o encontre e inclua no seu indexador.

Divulgue a publicação no Facebook.

Você pode postar uma mensagem no seu mural no Facebook para informar a seus contatos que você publicou um website.

Divulgue a publicação no Twitter.

Você pode tweetar sobre seu site na sua linha do tempo no Twitter para informar seus seguidores que você publicou um website.


Exportar para o disco

Passo 5 - Exportar >

Exportar para o disco

 Return to chapter overview

Nesta janela você pode exportar uma cópia para seu computador do seu website publicado.

Esta opção é útil para manter uma cópia local dos arquivos publicados no servidor, para que você possa gravá-los em outra mídia (CD/DVD/USB) ou fazer alterações nas páginas HTML antes de confirmar a publicação do website na Internet.

Para exportar os arquivos do projeto, você precisa especificar:

§Pasta de destino: insira o nome da pasta onde o website será copiado. Se a pasta não existir, será criada automaticamente.

A opção Exportar para o disco não tem a intenção de ser usada para fazer uma cópia de segurança do seu projeto, porque ela exporta os arquivos usados na publicação online para o seu computador, e não o arquivo de projeto que pode ser editado.

Se quiser ter uma cópia de segurança do seu projeto, para que possa restaurar versões anteriores, você deverá usar os comandos de Backup no menu Salvar.

Se você quiser que uma cópia de segurança (backup) seja usada caso tenha perdido o projeto original, use o recurso Exportar o Projeto: ele fará uma cópia para você dos arquivos origianis do projeto.

Melhores práticas:

-

Como organizar as cópias de segurança do seu projeto


Exportar o Projeto

Passo 5 - Exportar >

Exportar o Projeto

 Return to chapter overview

Nesta janela você pode exportar todos os arquivos vinculados ao seu projeto em um único arquivo compactado para que o projeto possa ser transferido para outro computador ou para que você possa fazer uma cópia de segurança dele.

Você terá que definir:

§Pasta de destino: insira o nome da pasta para onde o projeto será exportado. Se esta pasta não existir, será criada automaticamente.

Quando o projeto tiver sido exportado, um único arquivo compactado é criado na pasta de destino. Ele terá o mesmo nome do projeto, com uma extensão .IWZIP. Por exemplo, se o arquivo do projeto tiver o nome "meuprojeto", o novo arquivo compactado será denominado "meuprojeto.iwzip". Os dois arquivos de projeto (um arquivo .IWPRJ) e todos os arquivos vinculados a ele (os arquivos de imagem, vídeo, áudio, animação Flash, etc) são salvos dentro do arquivo compactado.

Antes de exportar o projeto, você pode usar as seguintes opções:

§Incluir uma cópia dos arquivos de pré-visualização do site: você pode incluir no arquivo compactado .IWZIP os arquivos usados para montar as pré-visualizações quando consulta o site localmente (no seu computador). O tamanho do arquivo .IWZIP aumentará, mas não será necessário recriar os arquivos de pré-visualização se você transferir o projeto para outro computador.

O arquivo compactado .IWZIP pode ser transferido para outro computador e aberto pelo Programa usando o comando Importar... na janela Seleção do Projeto.

Melhores práticas:

-

Como organizar as cópias de segurança do seu projeto


Como organizar as cópias de segurança do seu projeto

Melhores Práticas > Configurações Gerais >

Como organizar as cópias de segurança do seu projeto

 Return to chapter overview
Exibir/Ocultar o texto oculto

Um aspecto fundamental da organização de um projeto é criar uma cópia de segurança dele.

Criar um backup de um projeto significa criar uma cópia de segurança, para manter no seu computador ou em outra mídia de armazenamento, como garantia contra a perda do original.

Se você tiver uma cópia de segurança (backup) do seu projeto, você está se garantindo no caso de:

§Recuperação de desastre - recuperar um projeto depois de erros fatais causados por problemas que ocorrerem no seu computador ou por apagar dados involuntariamente.

§Recuperação de versão - criar cópias que correspondam a versões diferentes do seu projeto, para que você possa, por exemplo, cancelar alterações feitas em uma sessão de trabalho e restaurar uma cópia de segurança feita antes das alterações.

Para as cópias de segurança (backup) serem realmente úteis, você precisa ser metódico e sistemático ao criá-las.

Clique para expandir/recolher Recuperação de versão - Como criar uma cópia de segurança automática

Para criar automaticamente uma cópia de segurança do seu projeto, você precisa:

§abrir o projeto,

§selecionar a opção Criar um Backup ao salvar o Projeto pela primeira vez no menu Salvar,

§ou então, ao mesmo tempo, selecionar a opção Criar backup a cada vez que publicar no menu Salvar.

Se você selecionar a opção Criar um Backup ao salvar o Projeto pela primeira vez, uma cópia de segurança do projeto é criada quando você salvar o projeto pela primeira vez, enquanto que se você selecionar a opção Criar backup a cada vez que publicar uma cópia de segurança é criada antes do site ser publicado online.

Todas as cópias de segurança que fizer são salvas na sub-pasta Backup na Pasta de Projetos que você especificar na janela Preferências.
Clique para expandir/recolher Recuperação de Versão - Como restaurar uma cópia de segurança de um projeto

Se você precisar restaurar uma cópia de segurança de um projeto, você terá que:

§abrir a sub-pasta Backup, na Pasta de Projetos (que você define na janela Preferências ) e selecionar o arquivo correspondente à cópia de segurança que deseja restaurar: pode ser tanto Backup.iwprj, criada com a opção Criar um Backup ao salvar o Projeto pela primeira vez, ou Datahora_publicacao.iwprj, criada com a opção Criar backup a cada vez que publicar;

§cortar o arquivo que você selecionou na sub-pasta Backup e colá-lo na Pasta de Projetos;

§apagar o arquivo "projeto.iwprj" que contém seu projeto e renomear o arquivo de backup como "projeto.iwprj";
Clique para expandir/recolher Recuperação de Desastres - Como fazer uma cópia de segurança do seu projeto

Se você quiser fazer uma cópia de segurança do seu projeto para manter em uma mídia de armazenamento separada, você terá que:

§selecionar Exportar o Projeto no Passo 5 - Exportar para exportar todos os arquivos vinculados ao seu projeto em um único arquivo compactado (.IWZIP);

§copiar o arquivo .IWZIP para a mídia de armazenamento na qual deseja salvar a cópia de segurança.

Clique para expandir/recolher Recuperação de Desastres - Como restaurar uma cópia de segurança do seu projeto

Se você quiser restaurar uma cópia de segurança do seu projeto que esteja armazenada em outro local, você terá que:

§clicar no botão Importar... na janela Seleção do Projeto para selecionar o arquivo compactado .IWZIP que contém o projeto que deseja restaurar;

§selecione o projeto restaurado para abri-lo e continuar a trabalhar nele.


Como traduzir o texto que é inserido automaticamente

Melhores Práticas > Passo 1 - Configurações Gerais >

Como traduzir o texto que é inserido automaticamente

 Return to chapter overview
Exibir/Ocultar o texto oculto

Alguns elementos nas páginas criadas com o WebSite X5 são adicionados automaticamente pelo Programa. Eles podem ser, por exemplo, links e âncoras para outras partes do site, botões no Objeto Galeria, legendas para o Objeto Formulário de Email, legendas e texto para o carrinho de compras, ou texto que aparece no Mapa.

Obviamente, o texto que aparece nesses elementos deve estar no idioma correto para o site, e para garantir que isto acontecerá, você deverá especificar o idioma primário do site na opção Idioma do conteúdo que fica na janela Configurações Gerais. O WebSite X5 oferece alguns idiomas como padrão, incluindo o inglês, italiano, alemão, com as traduções necessárias já feitas. As traduções oficiais podem ser alteradas, e você pode importar novos idiomas, ou remover os desnecessários. Para fazer isso, clique no botão [image] ao lado do Idioma do conteúdo na janela Gerenciar conteúdos do idioma.

Clique para expandir/recolher Como alterar texto automático pré-existente

Exemplos de texto adicionado automaticamente pelo programa são as legendas nos botões "Enviar" e "Limpar" nos formulários de email.

Imagine que você tenha selecionado "Português Brasileiro" (BR - Brazilian) como idioma do conteúdo, e queira alterar a legenda "Limpar" por "Recomeçar":

§Na janela Gerenciar conteúdos do idioma, clique em "BR - Brazilian" para exibir os elementos de texto em português brasileiro que já estejam presentes na tabela de tradução.

§Na primeira coluna da tabela procure pelo item "form_reset", que é a legenda para o botão que você deseja alterar. Mova na linha até a célula correspondente à coluna do português brasileiro. Dê um duplo clique na célula para fazer o cursor de edição de texto aparecer: apague a palavra "Limpar" e digite "Recomeçar" no lugar.

§Feche a janela: suas alterações serão salvas automaticamente.
Clique para expandir/recolher Como adicionar um novo idioma

Se você quiser criar um website em um idioma que não esteja incluído na lista de idiomas disponíveis (por exemplo, Romeno), para evitar que o texto automático adicionado seja em inglês (que é o idioma padrão), você deve adicionar um novo idioma à lista. Você também terá que providenciar as traduções para todos os textos, então tenha certeza de ter essas traduções disponíveis quando quiser adicionar um novo idioma. Uma vez que tenha as traduções necessárias, adicionar um novo idioma é bem simples:

§Na janela Gerenciar conteúdos do idioma, clique no botão Acrescentar novo idioma e digite "RO - Romeno" na caixa de diálogo que se abre. Este novo registro aparecerá ao final da lista de idiomas disponíveis.

§Clique em "RO - Romeno" para exibir a coluna para este idioma na tabela de tradução.

§Digite as traduções para cada linha e então feche a janela quando tiver terminado: isto salva automaticamente seu trabalho.

§Defina "RO - Romeno" como Idioma do conteúdo na janela Configurações Gerais.
Clique para expandir/recolher Como exportar/importar um idioma

Se você precisar desenvolver um website em dois computadores diferentes em um idioma que não seja atendido pelo Programa, você precisará exportar o novo idioma criado em um dos computadores e exportá-lo para o outro.

§No primeiro computador, clique em Acrescentar novo idioma para abrir a janela Gerenciar conteúdos do idioma e começar a traduzir para o novo idioma.

§Selecione o novo idioma na lista de idiomas disponíveis e clique em [image] Exportar o idioma selecionado: um arquivo .XML com o novo idioma será salvo na pasta especificada.

§Transporte o arquivo .XML para o outro computador.

§Abra o Programa no outro computador e vá para a janela Gerenciar conteúdos do idioma. Clique em [image] Importar um novo idioma para selecionar o arquivo .XML a ser importado.

Se o idioma importado já estiver na lista, ele não será duplicado, mas qualquer novo item será adicionado e itens modificados serão atualizados.

Melhores práticas:

-

Como criar um website em vários idiomas


Como usar a Central Google para Webmasters™

Melhores Práticas > Passo 1 - Configurações Gerais > Trabalhando com o Google >

Como usar a Central Google para Webmasters™

 Return to chapter overview

Central Google para Webmasters™ é um serviço gratuito fornecido pelo Google™ para auxiliar Administradores web a projetar um website que esteja em conformidade com seus métodos de análise de sites. Essas ferramentas ajudam a diagnosticar problemas com o website e, se utilizadas corretamente, podem ajudar a melhorar a posição nos resultados das buscas.

Para usar a Central Google para Webmasters™, você primeiro precisa ter uma Conta Google e poder provar que é o proprietário do website a ser analisado. Uma forma de provar que o website é seu é copiar uma meta tag fornecida pelo Google™ na primeira seção <head> da sua Página Inicial, antes da seção <body>.

Eis o que você precisa fazer:

§Abra uma conta no Google™.

§Vá para a página inicial da Central Google para Webmasters™ e faça o login.

§Clique em Adicionar um site na Página inicial e digite a URL completa do site que deseja que seja analisado. Clique em Continuar.

§Na Página de Verificação, selecione a aba Métodos alternativos e a opção Tag HTML como método de verificação.

§Copie a meta tag fornecida pelo Google™ e cole-a em Metatag de verificação para a Central do Webmaster do Google na janela Configurações Gerais | Avançadas do WebSite X5: o Programa irá adicionar a meta tag na posição correta do código HTML da sua Página Inicial.

§Uma meta tag de verificação do Google™ se parece com isto:

<meta name="verify-v1" content="VOPYsjbR4uw/YqV+MWLB0lVmJt0niwdkv9PQTsTREHQ=" />

§Uma vez que tenha publicado seu website, volte à página de Verificação do Site na Central Google para Webmasters™ e clique em Verificar para completar o procedimento.


Como monitorar o desempenho do website com serviços como o Google Analytics™

Melhores Práticas > Passo 1 - Configurações Gerais > Trabalhando com o Google >

Como monitorar o desempenho do website com serviços como o Google Analytics™

 Return to chapter overview

Muitas ferramentas de estatísticas para websites estão disponíveis na Internet, e uma das mais populares é o Google Analytics™. Esta ferramenta gratuita fornece diversos relatórios para monitorar e analisar as visitas no seu website. O Google Analytics™ pode ser usado para análises simples como contar o número de visitas, até trabalhos mais complexos como julgar a eficiência das suas campanhas de publicidade executadas no programa do Adsense™.

Para usar o Google Analytics™, você precisa informar ao mecanismo de busca qual website deverá ser analisado, e quais páginas deverão ser rastreadas. Para isso, você precisará adicionar um código de rastreamento especial às páginas do website.

Eis o que você tem que fazer:

§Abra uma conta no Google™.

§Vá para a página inicial do Google Analytics™ e faça o login.

§Na página Configurações, clique em Website para inserir a URL do website a ser analisado.

§Quando tiver criado o perfil, vá para a aba Informações de acompanhamento.

§Copie o código de rastreamento fornecido pelo Google™ nesta página e cole-o no campo Código personalizado da janela Configurações Gerais | Avançadas do WebSite X5, especificando que ele deverá ser adicionado antes da tag <head> ser fechada.

O código de rastreamento fornecido pelo Google™ se parece com isto:

<script type="text/javascript">

var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");

document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

</script>

<script type="text/javascript">

try {

var pageTracker = _gat._getTracker("UA-110367-1");

pageTracker._trackPageview();

} catch(err) {}</script>


Como criar e vincular o SiteMap do seu website

Melhores Práticas > Passo 1 - Configurações Gerais > Trabalhando com o Google >

Como criar e vincular o SiteMap do seu website

 Return to chapter overview
Exibir/Ocultar o texto oculto

O WebSite X5 gera o SiteMap XML do seu website.

Um SiteMap é um arquivo XML que contém uma lista de todas as páginas em um website. Foi introduzido pelo Google™ (e agora é usado pelo Yahoo! e pelo MSN) para sondar websites mais rápida e eficientemente. Em outras palavras, você cria e envia seu SiteMap a um webmaster, e isto pode assegurar que seus mecanismos de busca, neste caso o Google™, esteja informado da existência do seu website e de todas as suas páginas, incluindo aquelas que não seriam "vistas" por procedimentos normais de sondagem.

Você pode usar o SiteMap para direcionar os mecanismos de busca a incluir conteúdo específico do site, como vídeos, imagens, notícias, etc. O SiteMap também pode conter informações adicionais sobre a frequência em que as páginas são atualizadas, quando foram editadas por último a importância de cada página dentro do site (este parâmetro não afeta a posição de uma página dentro dos resultados de busca).

Clique para expandir/recolher Como ativar o SiteMap

Para criar e vincular o SiteMap a um website, deixe a opção Criar SiteMap automaticamente ativa como sendo a configuração padrão na janela Configurações Gerais | Avançadas.

Agora você pode adicionar informações extras para cada página, como se segue:

§No Passo 2 - Criação do mapa selecione a página em que deseja trabalhar.

§Clique no botão Propriedades para abrir a janela Propriedades da Página e abrir a aba Avançadas.

§Deixe a opção Inserir esta página no SiteMap como está (ativa) e selecione as opções Prioridade do conteúdo e Frequência de atualização.

§Repita estas operações para as outras páginas no site.
Clique para expandir/recolher Como incluir imagens no SiteMap

O SiteMap pode ser usado para fornecer informações adicionais ao Google™ sobre as imagens que estão no website, ajudando assim o mecanismo de busca a encontrar imagens que de outra forma passariam despercebidas (por exemplo, as que são incluídas em módulos em JavaScript) e para reconhecer imagens que são mais importantes do que outras. Por exemplo, ao não incluir no SiteMap imagens que são parte integrante do modelo visual do site, ou que sejam meramente ornamentais, você indica para o Google™ que elas são menos importantes do que as outras.

O Google™ especifica que você pode adicionar no máximo 1000 imagens por página no SiteMap, e que ele não garante que todas as imagens serão indexadas, nem que todas as informações adicionais serão levadas em conta.

Uma vez que tenha criado seu SiteMap, é fácil adicionar informações sobre as imagens:

§Dê um duplo clique no Objeto Imagem que corresponde à imagem em que deseja trabalhar, para abrir a janela Objeto Imagem.

§Abra a aba Sitemap e selecione a opção Adicionar imagem ao Sitemap.

§Os campos Título, Legenda, Localização geográfica (p.ex. Endereço, Cidade, etc) e URL da licença são opcionais.

§Repita estas operações para todas as imagens importantes no seu website.

Para maiores informações, veja Objeto Imagem | Sitemap.
Clique para expandir/recolher Como incluir vídeos no SiteMap

O SiteMap também pode ser usado para informar ao Google™ sobre os vídeos que você tem no seu site. Novamente, o Google™ não dá nenhuma garantia, mas se você incluir vídeos no SiteMap, você aumenta a possibilidade que eles sejam rastreados e incluídos nas buscas do Google Video™.

Você pode usar o SiteMap para fornecer informações adicionais, tais como título, descrição e duração do vídeo, que podem simplificar as buscas. Estas e outras informações serão incluídas na página de resultados do mecanismo de busca (Search Engine Results Page - SERP). No entanto, o Google™ pode usar o texto na sua página do vídeo para os SERPs, em vez do texto que você fornecer no conteúdo do SiteMap, caso sejam diferentes.

Completar o SiteMap com conteúdo de vídeo é fácil:

§Dê um duplo clique na opção Objeto Vídeo/Som para o vídeo que deseja adicionar, para abrir a janela Objeto Vídeo/Som.

§Abra a aba Sitemap e selecione a opção Adicionar vídeo ao Sitemap.

§Adicione as informações obrigatórias que deverão ser incluídas no SiteMap: Título, Legenda e Imagem de Pré-visualizção do vídeo.

§Opcionalmente você pode incluir as seguintes informações: Categoria, Palavras-chave, Data de publicação, Duração (seg) e Conteúdo apropriado a todas as idades.

§Repita estas operações para cada vídeo que deseje incluir no SiteMap.

Para maiores informações, veja Objeto Vídeo/Som | Sitemap.
Clique para expandir/recolher Como remover uma página do SiteMap

Quando um SiteMap é criado, todas as páginas no website são incluídas nele por padrão. Se você não quiser que os mecanismos de busca considerem uma determinada página, basta removê-la do SiteMap:

§Selecione a página que deseja remover do SiteMap na janela no Passo 2 - Criação do mapa.

§Clique no botão Propriedades para abrir a janela Propriedades da Página, e então abra a aba Avançadas.

§Desmarque a opção Inserir esta página no SiteMap.

§Confirme e salve.

Fontes:

- | SiteMap (en.wikipedia.org)
- | Sobre Sitemaps (Goggle WebMaster Central)
- | Adicionando informações sobre imagens a um Sitemap (Google WebMaster Central)
- | Conteúdo de vídeo nos Sitemaps (Google WebMaster Central)


Como trabalhar com os modelos

Melhores Práticas > Passo 1 - Configurações Gerais > Os modelos >

Como trabalhar com os modelos

 Return to chapter overview
Exibir/Ocultar o texto oculto

Com o WebSite X5, você achará fácil trabalhar com os modelos gráficos (a espinha dorsal do seu website), porque eles são totalmente flexíveis e fáceis de usar. Graças aos modelos padronizados, com inúmeras possibilidades de personalização e, acima de tudo, a possibilidade de criar seus próprios modelos, você pode ter a certeza de obter a aparência que deseja para o seu site.

Você também pode importar e exportar modelos (extraíndo-os de projetos para os quais tenham sido originalmente criados) e isto torna o compartilhamento de recursos incrivelmente simples.

Clique para expandir/recolher Como usar um modelo padronizado

O WebSite X5 fornece uma galeria com mais de 1.500 modelos padronizados. Escolher um que seja o certo para você é simples:

§Abra a janela Seleção do Modelo e filtre o Tipo de Menu que o interessa (horizontal ou vertical).

§Examine as miniaturas dos modelos para escolher o que mais gostar.

§Selecione o modelo que desejar usar e clique no botão Avançar para aplicá-lo ao seu projeto e abra o Personalização do modelo onde poderá adicionar elementos ao cabeçalho e ao rodapé.
Clique para expandir/recolher Como criar um modelo personalizado

Quando tiver criado um layout, usando um editor gráfico externo, você poderá aplicá-lo ao seu projeto no WebSite X5 com o recurso de Modelo Personalizado:

§Abra o Seleção do Modelo e use o filtro para Categorias para exibir os modelos personalizados.

§Haverá pelo menos um modelo personalizado na lista. Você pode selecioná-lo e clicar no botão Editar... (ou dar um duplo-clique no modelo) para abrir a janela Modelo personalizado.

§Se quiser criar um novo modelo personalizado, começando do zero, para adicionar à galeria, clique no botão Novo Modelo: dê um nome ao novo modelo e comece a trabalhar nele.

Todos os modelos personalizados que forem criados são adicionados à Galeria de Modelos, e poderão ser usados para outros projetos.
Clique para expandir/recolher Como criar um novo modelo baseado em um modelo padronizado

Um modelo padronizado é frequentemente uma boa forma de começar a criar seu próprio modelo personalizado, se você gostar do layout básico mas quiser adicionar algumas idéias próprias. Eis o que você precisará fazer:

§Abra a janela Seleção do Modelo e use os filtros para identificar e selecionar o modelo padronizado a partir do qual deseja começar a criar.

§Clique no botão Duplicar para fazer uma cópia do modelo: esta cópia será salva junto com os modelos personalizados.

§Selecione a cópia que você acabou de criar e clique no botão Avançar para abrir a janela Modelo personalizado, onde você poderá realizar as alterações necessárias.
Clique para expandir/recolher Como importar/exportar um modelo

Você pode exportar o modelo de um projeto para que possa usá-lo em outro computador, ou para que possa ser usado por outras pessoas.

Para exportar um modelo:

§Abra a janela Seleção do Modelo, selecione o modelo e clique no botão Exportar...: um arquivo .IWTLP é criado na pasta de exportação que você indicar.

§Copie este arquivo .IWTPL para o computador para o qual deseja exportar o modelo.

Para importar um modelo que tenha sido exportado via WebSite X5:

§Abra a janela Seleção do Modelo no segundo computador e clique no botão Importar...: selecione o arquivo .IWTPL do modelo a ser importado.

§O modelo importado será adicionado à lista de modelos personalizados.

Arquivos .IWTPL só contêm as imagens e configurações para o modelo a que se refere: quando exportados, eles não incluirão informações do projeto.

Para exportar um projeto, você precisará usar os comandos no Passo 5 - Exportar.

Melhores práticas:

-

Onde encontrar novos modelos do WebSite X5


Onde encontrar novos modelos do WebSite X5

Melhores Práticas > Passo 1 - Configurações Gerais > Os modelos >

Onde encontrar novos modelos do WebSite X5

 Return to chapter overview

Se você estiver procurando por um novo modelo para criar ou remodelar um website, você encontrará muitas novas idéias em WebSite X5 Templates, a seção do website oficial do WebSite X5 que você pode acessar em http://answers.websitex5.com/templates.

Em WebSite X5 Templates você encontrará muitos modelos novos que foram criados pela Incomedia ou por outros usuários. Alguns são grátis e alguns são pagos. Você pode baixá-los e usar nos seus projetos.

Você também pode oferecer seu próprio trabalho. Se você curte web design, pode se tornar um dos nossos autores associados, enviando suas propostas e ganhando dinheiro. Para maiores informações, acesse http://answers.websitex5.com/templates.

Não se esqueça de visitar a WebSite X5 Templates regularmente, para ver as novidades: se você quiser, poderá assinar a RSS feed e manter-se constantemente atualizado com as úlitmas novidades.


Como criar e trabalhar no Mapa do site

Melhores Práticas > Passo 2 - Criação do mapa >

Como criar e trabalhar no Mapa do site

 Return to chapter overview
Exibir/Ocultar o texto oculto

No WebSite X5 o Mapa do site tem uma estrutura típica de árvore: derivando da Página Inicial e ramificando para os diversos níveis, onde as páginas ficam. Todo mapa do site tem uma Página Inicial e uma quantidade variável de páginas ligadas pelo menu. Quando você adiciona páginas, organize-as nos diversos níveis do menu.

Lembre-se que os níveis no WebSite X5 são categorias e não páginas reais com conteúdo. Níveis contêm as páginas.

Separadores também não possuem conteúdo. Eles são usados para organizar visualmente o menu de navegação.

Clique para expandir/recolher
Exemplo de um mapa e seu menu

Sua finalidade, no desenvolvimento do Mapa do site, é criar uma estrutura lógica para o conteúdo do site em si, para que os visitantes possam encontrar facilmente as informações que procuram.

Clique para expandir/recolher Como criar o Mapa do site

Criar e projetar o Mapa do site no WebSite X5 é fácil:

§Na janela do Passo 2 - Criação do mapa use os botões Novo Nível, Nova Página e Separador para adicionar novos níveis, páginas e separadores ao seu Mapa.

§Dê uma atenção especial aos nomes dos itens do Mapa: estes nomes aparecem no menu de navegação e como nome dos arquivos. Se você quiser alterar um nome, clique duas vezes nele ou use o botão Renomear.

§Você pode editar o Mapa a qualquer momento, movendo páginas, níveis e separadores para outras posições: selecione o item que você deseja mover e arraste-o para uma nova posição, ou você pode usar os botões Para cima / Para baixo.
Clique para expandir/recolher Como trabalhar no Mapa do site (comandos e atalhos)

Há vários atalhos disponíveis para agilizar o trabalho no Mapa do site:

§Clique uma segunda vez em um nível já selecionado (inclusive na Página Inicial), ou em um separador, para renomeá-lo (em vez de usar o botão Renomear). Você também pode renomear os apelidos para as páginas Especiais na pasta do Menu, mas não poderá renomear as páginas Especiais em si.

§Após selecionar uma página, clique no Título completo da página ou na Descrição para alterar o texto (senão você terá que reabrir a janela Propriedades da Página para editar o texto).

§Você pode dar um duplo clique em um nível para expandi-lo e ver todas as páginas naquele nível, e dar um duplo clique novamente para recolher o nível (fazer isto é mais rápido do que usar os botões Expandir e Recolher). Você também pode expandir e recolher um nível clicando na seta em frente ao nome dele.

§Dê um duplo clique em uma página para abrir a janela Criação da página, onde poderá criar a página em si.

§Dê um duplo clique em uma página Especial para abrir a janela Passo 4 - Configurações Avançadas, onde você poderá criar/editar a página.

§Selecione um nível e arraste-o para uma nova posição, levando junto todas as páginas nele (em vez de usar os botões Para cima / Para baixo).

§Selecione uma ou mais páginas e arraste-as para a nova posição (em vez de usar os botões Para cima / Para baixo). Use as combinações CTRL + clique ou SHIFT + clique para selecionar vários itens ao mesmo tempo. Seleções múltiplas podem incluir paginas Ocultas ou Protegidas.

§Selecione a pasta do menu e oculte o menu de navegação no botão Página oculta.

§Selecione uma página Especial e arraste-a para a pasta do Menu (para as páginas e níveis que formam o menu de navegação) para criar um nível que atuará como um apelido para a página Especial. Este nível terá o mesmo nome da página Especial e será vinculado a ela. Ao fazer isto, você fornece um link no menu de navegação que irá diretamente para a página resultante no mecanismo de busca interno, para a página de Introdução, para o Blog, para a Área Restrita ou para o carrinho de compras.

§Selecione uma ou mais páginas e copie e cole-as em outro lugar do projeto, ou em um projeto diferente se tiver aberto outra janela do programa. Você pode usar os comandos na barra de ferramentas, no menu popup (clicando com o botão direito do mouse) ou as combinações de teclae CTRL+C e CTRL+V. Lembre-se que você não poderá copiar e colar as páginas Especiais.


Como criar uma página usando a tabela de layout de página

Melhores Práticas > Passo 3 - Criação da página >

Como criar uma página usando a tabela de layout de página

 Return to chapter overview
Exibir/Ocultar o texto oculto

O WebSite X5 usa um método de layout de página exclusivo onde você pode ver exatamante como a página ficará à medida em que trabalha nela.

A página é exibida como uma tabela onde você pode especificar o número de linhas e de colunas para formar as células que conterão os diversos tipos de conteúdo.

Você pode facilmente arrastar e soltar os Objetos de conteúdo para dentro das células.

Clique para expandir/recolher Referência: Como montar a tabela de layout de página

A tabela padrão contém 2 linhas x 2 colunas, e você pode adicionar mais linhas e colunas para ter células suficientes para todo o conteúdo planejado, e você pode prosseguir para a adição dos Objetos de conteúdo necessários nas células.

Use os botões [image] [image] na barra de ferramentas para adiconar linhas e colunas. A tabela pode ter no máximo 64 linhas e 12 colunas.

Todas as linhas e colunas na tabela de layout de página automaticamente têm a mesma largura e altura. você pode alterar a largura das colunas manualmente, inserindo um valor absoluto (em pixels) ou relativo (como porcentagem), usando os cursores ao pé da tabela:

§Clique e arraste um marcador de coluna para mover a linha divisória de colunas. É movida em décimos do espaço disponível. Para uma maior precisão, mantenha a tecla CTRL pressionada para mover a linha um pixel por vez.

Clique para expandir/recolher

§Clique com o botão direito do mouse sobre um marcador de coluna e selecione Configurar largura da coluna no menu, e então digite a largura em pixels.

Clique para expandir/recolher

§Clique com o botão direito sobre um marcador de coluna e selecione Mesma largura para as colunas para que todas as colunas voltem a ter a mesma largura.
Clique para expandir/recolher Referência: Como adicionar conteúdo à tabela de layout de página

Uma vez que tenha definido o tamanho da tabela de layout de página, você pode inserir o conteúdo da página adicionando Objetos às células. Para adicionar um Objeto, selecione o ícone que o representa e arraste-o para a célula adequada.

Uma célula só pode conter um único Objeto, mas um Objeto pode ocupar várias células adjacentes. Se você soltar um ícone de um Objeto na borda de uma célula, o Objeto ocupará as células que compartilham aquela borda. Você também pode puxar os marcadores de seleção do Objeto para puxá-lo para dentro de células adjacentes.

Você pode mover Objetos pela tabela de layout de página, mesmo se eles ocuparem mais de uma célula, desde que haja espaço suficiente para eles na posição onde deseja movê-los. Você pode usar as setas do teclado para mover Objetos:

§teclas de seta: movem a seleção de uma célula para outra na tabela.

§CTRL + tecla de seta: esta combinação move o Objeto selecionado para um local diferente na tabela, mantendo a quantidade de células que ocupa, porém ajustando-o ao espaço disponível na(s) célula(s) destino(s).

§SHIFT + tecla de seta: esta combinação move o Objeto selecionado para um local diferente na tabela porém altera seu tamanho, tornando-o maior (desde que compatível com outros Objetos existentes na tabela) ou menor para ocupar menos células.

Você pode clicar com o botão direito no ícone de um Objeto em uma célula , ou em uma célula vazia, para abrir um menu com os comandos Cortar, Copiar, Colar, Remover, Estilo da célula, Inserir linha, Inserir coluna, Remover linha e Remover coluna.

Use esses comandos, por exemplo, para copiar um Objeto e colá-lo em uma célula ou página diferente, ou para removê-lo. Você também pode remover um Objeto arrastando-o para fora da tabela de layout de página, ou pressionando a tecla DEL. Lembre-se que um Objeto será removido se você adicionar um novo Objeto à célula em que ele estiver, e o segundo Objeto tomará seu lugar. Entretanto, se você arrastar um Objeto de uma célula para outra célula já ocupada, os dois Objetos simplesmente trocarão de lugar.

Os comandos Copiar e Editar no submenu do comando Estilo da célula são usados para aplicar as configurações definidas na janela Estilo da célula de uma célula para outra.

Quando você adiciona um Objeto a uma célula, você pode abrir a janela que define seu conteúdo (Objeto Texto, Objeto Imagem, Objeto Tabela, Objeto Galeria, Objeto Vídeo/Som, Objeto Formulário de Email, Objeto Livro de Visitas, Objeto Rede Social, Objeto Mapa, Objeto Animação Flash, Objeto Lista de Produtos, Objeto HTML e Widgets), dando um duplo clique na célula da tabela onde inseriu ou selecionou o Objeto ou clicando no botão [image] Inserir o Conteúdo do Objeto selecionado.

Você não tem que ocupar todas as células da tabela: lembre-se, no entanto, que uma célula vazia corresponderá a um espaço vazio na página.

Para fazer o melhor uso das possibilidades oferecidas pelo layout de página, lembre-se que o software segue as seguintes regras:

§A largura da página é determinada pelo modelo.

§A largura das colunas na tabela é igual à da largura da página dividida pelo número de colunas. Por padrão, todas as colunas terão a mesma largura, mas você pode alterar a largura de cada uma manualmente.

§Todas as células em uma linha têm a mesma altura: por padrão, será a altura do maior Objeto entre os que ocuparem as células da mesma linha.

§Objetos inseridos são automaticamente redimensionados de acordo com o tamanho da células na tabela.

Maiores informações:

-

O Box Model no WebSite X5


Como trabalhar com o Estilo da célula

Melhores Práticas > Passo 3 - Criação da página >

Como trabalhar com o Estilo da célula

 Return to chapter overview
Exibir/Ocultar o texto oculto

Quando estiver trabalhando na Criação da página, e tiver arrastado um objeto para uma célula na tabela de layout de página, você pode definir o estilo da célula, clicando no botão [image] e usando as opções da janela Estilo da célula.

Clique para expandir/recolher Como criar uma imagem de fundo que se ajusta ao tamanho da célula

Você pode personalizar o estilo de uma célula de várias maneiras: uma delas é importar uma imagem (um arquivo no formato .JPG, .GIF ou .PNG) e usá-la como plano de fundo para a célula. Dependendo da imagem que você importar, terá que escolher a opção Imagem de fundo e definir as opções Repetir e Alinhamento, ou usar a opção Ajustar imagem à célula para encontrar o melhor resultado.

Exemplo 1

A imagem importada tem o mesmo tamanho da célula.

Fundo: Imagem de fundo

Repetir: não repetir

Alinhamento: Em cima - Esquerda

Clique para expandir/recolher

Exemplo 2

A imagem importada não é um padrão: não há uma junção vertical ou horizontal quando duas ou mais partes idênticas são colocadas lado a lado.

Fundo: Imagem de fundo

Repetir: ladrilho

Alinhamento: Em cima - Esquerda

Clique para expandir/recolher

Exemplo 3

A imagem importada é uma moldura que deve ser adaptada a células de tamanho variado.

Fundo: Ajustar imagem à célula

Largura do bloco / Altura do bloco: defina o melhor tamanho para os blocos.

Clique para expandir/recolher

Para entender melhor como a opção Ajustar imagem à célula funciona, o que são blocos e como dar o tamanho ideal a eles, considere as seguintes imagens:

Imagem 1 | Imagem 2 | Imagem 3

A imagem original (Imagem 1) é uma moldura elaborada que pode ser facilmente cortada em blocos e adaptada a qualquer tamanho: as partes ornamentas nos cantos são fixas e o sombreamento pode ser repetido como um padrão sem mudanças abruptas na cor.

Na Imagem 2, você pode ver os blocos cujo tamanho devem ser expecificados (nas opções Largura do bloco e Altura do bloco). A largura e a altura são as mesmas para todos os blocos e é dada como uma porcentagam da imagem original: pode variar de 5% a 45%. O corte no exemplo é de 35% tanto para a largura quanto para a altura: este valor garante que cada bloco incluirá o elemento de canto.

A Imagem 3 mostra como é possível, a partir dos blocos A, B, C e D extraídos da imagem original, obter 5 outros blocos, a, b, c, d e e: esses são os blocos que o Programa corta para obter todas as partes da imagem que são necessárias para completar o fundo da célula. Os Blocos A, B, C e D são mantidos inalterados e posicionados nos cantos da célula, e os outros cinco blocos, a, b, c, d e e, são repetidos para preencher o resto do espaço.

A opção Ajustar imagem à célula é, portanto, muito útil para adaptar a mesma imagem para que se ajuste a células de diferentes tamanhos.

Clique para expandir/recolher Como usar a biblioteca de estilos da célula

Você pode economizar tempo com a Biblioteca: se precisar aplicar o mesmo estilo a diversas células, poderá defini-lo para somente uma célula, salvar o estilo e então aplicá-lo a todas as outras células.

Para criar um novo estilo:

§Na tabela de layout de página, selecione a célula na qual deseja trabalhar e clique no botão [image] para abrir a janela Estilo da célula.

§Use as opções disponíveis nas abas Estilo e Texto para obter a aparência desejada.

§Abra a aba Biblioteca e clique no botão Adicionar: um novo estilo é criado de acordo com suas configurações. Uma miniatura do estilo é criada e adicionada à lista dos estilos Personalizar.

Para aplicar um estilo a uma célula:

§Na tabela de layout de página selecione a célula em que deseja trabalhar e clique no botão [image] para abrir a janela Estilo da célula.

§Vá para a aba Biblioteca e selecione a miniatura do estilo que deseja aplicar, escolhendo entre os que estão na lista e estilo Pré-definidas ou entre os da lista Personalizar.

§Clique no botão Aplicar.

Maiores informações:

-

O modelo de Quadros no WebSite X5


Como criar um website em vários idiomas

Melhores Práticas > Passo 4 - Configurações Avançadas >

Como criar um website em vários idiomas

 Return to chapter overview
Exibir/Ocultar o texto oculto

A Internet derruba todas as fronteiras nacionais e internacionais e se você acredita que seu site possa vir a ser visitado por pessoas de outros países, seria bom pensar em oferecer a eles o seu website em outros idiomas.

Gerenciar um site em vários idiomas torna um projeto mais complexo, mas graças aos recursos que são disponíveis no WebSite X5, e se você puder contar com um serviço bom e confiável de tradução, o resultado final poderá dar mais trabalho, mas valerá a pena.

Em primeiro lugar, você deve se lembrar que o WebSite X5 gera todos os arquivos HTML para as páginas do site na codificação UTF-8 (Unicode Transformation Format, 8 bit), para permitir suporte integral a todos os idiomas, inclusive os que não usam alfabetos latinos, como grego, cirílico, cóptico, armênio, hebraico, árabe, chinês, japonês e coreano. Não somente você pode ter websites em outros idiomas, mas também poderá ter textos em diferentes idiomas no mesmo website, e todos os caracteres serão exibidos corretamente: você pode ter um trecho em russo com sua tradução ao lado em português.

Quando estiver criando o seu site, o WebSite X5 pedirá para associar um idioma ao seu projeto (na opção Idioma do conteúdo da janela Configurações Gerais | Básicas): isto é essencial para um tratamento correto do texto que será adicionado automaticamente pelo Programa. Algumas opções de idioma já estão incluídas por padrão, e você poderá adicionar outras na janela Gerenciar conteúdos do idioma, clicando no botão [image] para criar/importar novos idiomas ou para alterar algumas palavras nos idiomas já incluídos (veja Como traduzir o texto que é inserido automaticamente).

Com o WebSite X5 você pode criar um website com várias versões de idioma e dar ao visitante a opção de escolher qual idioma ele deseja usar. Tudo o que terá que fazer é criar um projeto para cada idioma que pretende oferecer, e conectá-los como se fossem partes diferentes do mesmo website. Você pode usar a Página de Introdução ou adicionar um link no cabeçalho do modelo para oferecer opções de idiomas.

Clique para expandir/recolher Como criar um website com vários idiomas usando a página de Introdução

Imagine que queria criar um website em inglês, italiano e português. Você pode usar a Página de introdução para adicionar os botões que os visitantes selecionarão para ir para a versão no idioma que preferirem.

§Em primeiro lugar, crie seu website em português, definindo a estrutura e seu conteúdo, e em Configurações Gerais | Básicas defina "BR = Brazilian" como Idioma do conteúdo.

§No Passo 4 - Configurações Avançadas clique no botão Página de introdução e, na janela que se abre, selecione a opção Mostrar Página de introdução, especificando a imagem/animação que deverá ser usada como Fundo da página e defina as configurações necessárias para obter o estilo que deseja.

§Clique na opção Mostrar links para outros idiomas para criar os botões de seleção de idioma.

§Use os comandos disponíveis para criar a Lista de idiomas. Selecione "Deutsch", "Español" e "Français" como idiomas indisponíveis e clique no botão Remover. Então clique no botão Adicionar... para abrir a janela Configurações de idioma e adicionar o português: digite "Português" como Nome do idioma a exibir e importe um arquivo para a imagem a ser associada ao idioma (geralmente usa-se a bandeira do país).

§Selecione "English" e "Italiano" e clique no botão Editar... para abrir a janela Configurações de idioma e adicionar as imagens das bandeiras para estes idiomas.

§O idioma básico é definido por padrão como sendo o inglês (o idioma padrão é o único idioma associado à página de Introdução), então selecione "Português" na Lista de idiomas e clique no botão Pré-definido para torná-lo o idioma padrão.

§Use os botões Para cima / Para baixo para posicionar os idiomas na ordem de sua preferência.

Quando tiver adicionado as imagens das bandeiras, você terá que definir os links para elas. Um website deverá ser criado para cada idioma, e publicado online, para que você possa criar um link com uma URL:

§Na janela 'Lista de idiomas, selecione "Italiano" e clique no botão Editar... para abrir a janela Configurações de idioma.

§Clique no botão [image] para a opção Link para este Idioma (isto é: mostrar o Site neste idioma) e selecione Arquivo ou URL na janela Link e insira a URL para a versão do seu website em italiano: por exemplo http://www.meusite.com.br/it/index.html, se você for publicar a versão italianda do site na sub-pasta "it" do diretório principal do servidor.

§Repita as mesmas operações para seu website em inglês, vinculando-o ao endereço URL relativo: por exemplo, http://www.meusite.com.br/en/index.html, se for publicar a versão em inglês do seu site na sub-pasta "en" do diretório principal do seu servidor.

Agora seu website está pronto para as opções de idioma, mas você ainda precisará do conteúdo em italiano e em inglês.

§Faça uma cópia do seu website em português para acelerar a criação do site em italiano: na primeira janela Seleção do Projeto, selecione o projeto do website em português e clique no botão Duplicar. Então clique no botão Renomear para alterar o nome para o novo projeto em italiano.

§Abra a cópia do projeto e, em Configurações Gerais | Básicas, defina "IT - Italian" como Idioma do conteúdo: traduza todo o texto e quaisquer outros elementos que dependam do idioma.

§No Passo 4 - Configurações Avançadas, vá para a janela Página de introdução e desmarque a opção Mostrar Página de introdução.

§Quando tiver completado a tradução do projeto em italiano, faça a mesma coisa para criar a versão do seu website em inglês.

Para publicar os websites no servidor, você deverá executar os seguintes procedimentos:

§Publique o website em português: o site em português é o que está associado à página de Introdução, e é definido como sendo o site "base". Quando publicar o site, um arquivo index.html será criado e que corresponderá à página de Introdução, e você precisará criar as sub-pastas "it" e "en" no Servidor para que as URLs destes sites funcionem.

Quando tiver terminado esta parte, o website em português estará online, e os links na página de Introdução para os outros idiomas estarão ativos, mesmo que não levem a lugar algum por enquanto.

§Publique o site em italiano: o link na página de Introdução da versão em português só funcionará se você publicar a versão do site em italiano na sub-pasta "it" que você criou no Servidor.

§Publique o site em inglês: o link na página de Introdução da versão em português só funcionará se você publicar a versão do site em inglês na sub-pasta "en" que você criou no Servidor..

Quando tiver publicado os três websites nas sub-pastas corretas, os botões na página de Introdução estarão funcionando corretamente e os visitantes poderão escolher em qual idioma preferem visitar o site.

Você pode usar a opção Link para este Idioma (isto é: mostrar o Site neste idioma) na janela Configurações de idioma para associar qualquer tipo de ação às imagens que representam os diversos idiomas (geralmente uma imagem da bandeira do país). Isto significa que, em vez de ter um link para um site inteiro, como vimos no exemplo, você pode criar um link para somente uma página ou uma mensagem que diga que o site naquele idioma ainda não está disponível, mas que estará em breve, ou para um documento em PDF com todas as informações que quiser fornecer naquele idioma, ou qualquer outra coisa.
Clique para expandir/recolher Como criar um website em vários idiomas usando botões no cabeçalho do modelo

Se você quiser criar um website que esteja disponível em inglês, italiano e português, em vez de usar a janela Página de introdução, uma alternativa, ou uma forma complementar de fazer isto é colocar botões de opção de idioma no cabeçalho do modelo. Este método tem a vantagem que os visitantes podem mudar o idioma de visualização do site a qualquer momento e em qualquer página do site.

§Em primeiro lugar, você terá que criar o site em português, definindo a estrutura e o conteúdo e na janela Configurações Gerais | Básicas definir "BR - Brazilian" como Idioma do conteúdo.

§Abra a janela Personalização do modelo para trabalhar no cabeçalho e criar os botões para que os visitantes possam escolher qual idioma querem usar.

§Usando o botão [image] Inserir imagem, importe o arquivo da imagem que usará como símbolo do idioma: se desejar que o botão apresente um efeito sob foco, use a opção Arquivo de imagem sob foco para importar uma segunda imagem, ligeiramente diferente da primeira.

§Repita este procedimento para criar os botões para as bandeiras em italiano e em inglês.

§Selecione o botão para o italiano e clique no comando [image] Associar um link a este objeto: na janela Link que se abre, selecione Arquivo ou URL e então selecione a opção Arquivo na internet, digitando o endereço para a página Inicial do website em italiano quando ele estiver online (por exemplo, http://www.meusite.com.br/it/index.html).

§Repita o mesmo procedimento para o botão do inglês, vinculando-o à URL relativa (por exemplo http://www.meusite.com.br/en/index.html).

Como você estará trabalhando na versão em português do seu site, você não precisará adicionar nenhum link para o botão com a bandeira correspondente ao idioma (por exemplo, a bandeira do Brasil).

§Faça uma cópia do seu website em português para agilizar a criação do site em italiano: na primeira janela Seleção do Projeto, selecione o projeto do site em português e clique no botão Duplicar. Então clique no botão Renomear para alterar o nome para o novo projeto em italiano.

§Abra a cópia do projeto e, na janela Configurações Gerais | Básicas, defina "IT - Italian" como sendo o Idioma do conteúdo: traduza todos os textos e outros elementos que dependem do idioma.

§Vá para a janela Personalização do modelo e complete os links para o botão/bandeira: associe o link na bandeira brasileira para a versão em português à URL do site base (por exemplo http://www.meusite.com.br/index.html) e remova o link para o botão na bandeira italiana.

§Quando tiver terminado de trabalhar na versão em italiano do site, você terá que repetir os mesmos procedimentos para o website em inglês. Lembre-se de definir os links nos botões para os idiomas português e italiano, e remover quaisquer links no botão para a versão em inglês.

Todos os três websites precisam ter sido publicados no Servidor para que os botões de opção de idioma funcionem corretamente.

§Crie duas sub-pastas no Servidor, no diretório principal de publicação, com os nomes"it" e "en".

§Publique o projeto em português (o idioma principal - padrão) no diretório principal no Servidor, e os projetos para as versões em italiano e em inglês do site nas sub-pastas "it" e "en", respectivamente.

Melhores práticas:

-

Como traduzir o texto que é inserido automaticamente


Como gerenciar os comentários no Blog e no Livro de Visitas a partir do Painel de Controle Online

Melhores Práticas > Passo 4 - Configurações Avançadas >

Como gerenciar os comentários no Blog e no Livro de Visitas a partir do Painel de Controle Online

 Return to chapter overview
Exibir/Ocultar o texto oculto

Um Blog é um tipo de diário online onde você pode publicar artigos de qualquer tipo, e dar aos visitantes a possibilidade de fazer comentários. Se sua comunidade de leitores for ativa e estimulada pelas diversas postagens, então discussões interessantes podem se desenvolver.

Clique para expandir/recolher Como configurar o gerenciamento de postagens no WebSite X5

Se você quiser que os visitantes do seu blog possam fazer comentários sobre suas postagens, você terá que configurar o Blog usando as opções na janela Blog | Comentários:

§Selecione a opção Permitir que leitores comentem no seu Blog.

§Especifique o caminho relativo da Pasta no servidor com permissão para escrita, que é a pasta onde o código PHP poderá fazer inserções.

§Decida se quer ativar o filtro anti-spam "Captcha" quando os comentários forem feitos.

§Especifique o Endereço de email do usuário, que é o endereço de email que receberá as notificações quando os visitantes fizerem comentários.

§Especifique se os comentários podem ser publicados imediatamente ou se devem ser aprovados antes.

Quando tiver feito isto, você poderá adicionar postagens e publicar seu Blog. Um formulário é adicionado automaticamente ao final das postagens, por onde os visitantes poderão enviar seus comentários. Este formulário solicita um nome, um endereço de email, um website e uma mensagem. Todos os campos são obrigatórios, exceto o campo do website.
Clique para expandir/recolher Como controlar os comentários no Painel de Controle online

Quando tiver configurado o modo como os comentários feitos no Blog deverão ser tratados, assim que um visitante fizer um comentário, um email de notificação será enviado ao endereço especificado (geralmente para o Administrador do site). Se você tiver selecionado a opção Exibir comentários após aprovação do administrador, os comentários terão que ser aprovados antes de serem publicados online e o WebSite X5 tem um comando para isto no Painel de Controle online.

O Painel de Controle pode ser encontrado na URL http://www.meusite.com.br/admin, onde http://www.meusite.com.br é o endereço do site ao qual o Blog está vinculado, e fica disponível para os usuários no grupo Administradores, que foram adicionados na seção Gerenciamento de acesso do Passo 4 - Configurações Avançadas.

Há duas listas suspensas na aba do Blog no Painel de Controle, e elas mostram as categorias e as postagens vinculadas a elas. Você pode escolher a postagem para a qual quer ver os comentários feitos. Uma lista de comentários informa o nome do autor, seu email, o texto do comentário e a data e hora em que foi feito. Se o autor tiver um website vinculado ao seu nome, este link ficará ativo automaticamente.

Para gerenciar os comentários, você terá que:

§Ir para o Painel de Controle online e fazer o login (fornecer usuário e senha), e então abrir a aba do Blog.

§Identifique a postagem para a qual quer ver os comentários, usando as listas suspensas que fornecem a lista de categorias e das postagens nelas.

§Percorra a lista de comentários e use estes comandos para gerenciá-los:

-Remover: para apagar um comentário. Ele não será publicado no Blog e será removido da lista de comentários no Painel de Controle.

-Aprovar/Rejeitar: para aprovar um comentário e assim permitir que seja publicado no seu Blog, ou rejeitar um comentário e removê-lo da lista das postagens do Blog. Um comentário rejeitado não é removido das listas no Painel de Controle.

É absolutamente necessário poder gerenciar quais comentários serão exibidos no seu Blog, para proteger-se contra spam ou moderar discussões, removendo conteúdo ofensifo ou simplesmente inapropriado.


Como definir o conteúdo de um email de confirmação do pedido de compra

Melhores Práticas > Passo 4 - Configurações Avançadas > O carrinho de compras da loja virtual >

Como definir o conteúdo de um email de confirmação do pedido de compra

 Return to chapter overview

Quando um comprador finaliza um pedido, é importante que ele receba uma confirmação da compra, para que possa verificar se forneceu todas as informações corretamente e consultar os detalhes sobre como deverá efetuar o pagamento.

O WebSite X5 automaticamente monta o email de confirmação do pedido de compra, obtendo os detalhes necessários a partir do próprio pedido.

Um email de confirmação do pedido de compra é feito da seguinte maneira:

Texto de introdução
Descrição: | É o texto que inicia o email. Geralmente é onde se agradece o cliente pela sua compra e se resume o conteúdo que virá a seguir.
Exemplo: | Caro Cliente, Obrigado pela sua compra. Aqui você encontrará um resumo do Pedido. Abaixo encontrará a lista dos produtos comprados, as informações de pagamento e as instruções sobre frete e forma de pagamento que escolheu.
Especificado em: | Carrinho de compras | Enviar pedido, no campo Texto de introdução.
Detalhes do comprador
Descrição: | Esta parte do email repete os dados da fatura que o comprador inseriu no formulário do pedido.
Especificado em: | O formulário do pedido pode ser definido em Carrinho de compras | Dados do cliente.
Resumo da compra
Descrição: | É a tabela que resume todos os produtos que foram encomendados: ela fornece a quantidade do produto, o total parcial e o valor total do pedido de compra.
Especificado em: | A tabela é criada automaticamente, de acordo com o pedido feito.
Forma de pagamento
Descrição: | Esta seção deverá fornecer ao comprador instruções precisas sobre como efetuar o pagamento, de acordo com a forma selecionada.
Exemplo: | Aqui estão os dados necessários para efetuar o pagamento por Transferência Bancária: XXX YYY ZZZ Note que uma vez que o pagamente seja efetuado é necessário enviar uma cópia do comprovante junto com o Número do Pedido.
Especificado em: | Na aba Mensagem de email da janela Tipo de Pagamento.
Forma de envio
Descrição: | Deverá resumir a forma de envio selecionada e fornecer, se possível indicações sobre quando e como os produtos serão entregues, e qualquer outra informação que possa ser útil.
Exemplo: | Para "Envio por Sedex": Envido por Sedex. As mercadorias serão entregues em 2-3 dias úteis.
Especificado em: | Na aba Mensagem de email da janela Tipo de Envio.
Texto de encerramento
Descrição: | É um parágrafo padronizado que contém expressões formais apropriadas pra encerrar o email.
Exemplo: | Continuamos à sua disposição para maiores informações. Atenciosamente, Equipe de Vendas.
Especificado em: | Carrinho de compras | Enviar pedido, no campo Texto de encerramento.

Como todos os outros emails que são montados e enviados automaticamente pelo Programa, o email de confirmação do pedido de compra tem seu estilo visual definido em Estilos e Modelos | Email.

Uma cópia do email de confirmação do pedido também será enviado no formato texto.

Melhores práticas:

-

Como importar/exportar produtos no carrinho de compras


Como importar/exportar produtos no carrinho de compras

Melhores Práticas > Passo 4 - Configurações Avançadas > O carrinho de compras da loja virtual >

Como importar/exportar produtos no carrinho de compras

 Return to chapter overview

Depois de criar um carrinho de compras para sua loja virtual, pode ser útil exportar o catálogo de produtos para usar em outro projeto, ou outro software, como por exemplo seu programa de contabilidade. Também é igualmente importante poder importar um catálogo de produtos para não ter que recriar tudo desde o início.

No WebSite X5 você pode importar/exportar catálogos de produtos usando a barra de ferramentas na janela Carrinho de compras | Produtos. Quando exportar um catálogo de produtos, um arquivo no formato .TXT ou .CSV é gerado, que pode ser facilmente aberto e editado por qualquer editor de textos (por exemplo o Bloco de notas do Windows) ou pelo Microsoft Excel.

Siga as indicações abaixo se for editar manualmente o arquivo do catálogo de produtos exportado, ou se for criar um novo para importar:

§A primeira linha deverá conter os títulos dos campos (colunas) com os seguintes termos:

ID;Category;Name/Code;Description;Price;Enable VAT;VAT Value;Weight;Options;Enable Discounts;Discounts

que em português equivalem a "Nr, Categoria, Nome/Código, Descrição, Preço, Habilitar ICMS, Valor do ICMS, Peso, Opções, Habilitar Descontos, Descontos".

§Se você remover um campo entre os títulos, você removerá os dados correspondentes para todos os produtos. Os campos obrigatórios (Category, Name/Code, Description e Price) não podem ser removidos.

§Cada linha depois do título corresponderá a um produto.

§Todos os parâmetros deverão ser separados pelo caractere ";".

§As seguintes informações deverão ser fornecidas para cada produto: Nome da categoria, Nome do produto (ou código), Descrição do produto, Preço do produto. Todos os outros campos são opcionais e podem ser omitidos (basta não escrever nada entre os caracteres ";" que separam os campos em questão).

§O Nr (ID) do produto é gerado pelo Programa: se você inserir um novo produto, deixe o campo do ID vazio.

§Qualquer espaço no arquivo será removido durante a importação.

Os parâmetros em um arquivo .TXT ou .CSV são:

Parâmetro: ID

Obrigatório

Não

Descrição

O identificador único para cada produto.

Valor

É gerado e associado a um único produto automaticamente pelo Programa.

Se você atualizar o arquivo .TXT ou .CSV de uma exportação anterior, não edite os IDs já existentes, e deixe o campo vazio para os novos produtos. Quando um catálogo é importado, o Programa verifica se há duplicidade de IDs e gera os que forem necessários.

Parâmetro: Category

Obrigatório

Sim

Descrição

A categoria do produto.

Valor

Use o caractere ">" para indicar o caminho relativo das categorias e sub-categorias.

Por exemplo, uma camiseta na sub-categoria "Casual" da categoria "Vestuário Masculino" seria indicada no arquivo .TXT ou .CSV como:

... ; Vestuário Masculino > Casual ; ...

Você pode adicionar todas as sub-categorias necessárias desta forma.

Parâmetro: Name/Code

Obrigatório

Sim

Descrição

O nome ou o código do produto.

Valor

Quando o catálogo é exportado para um arquivo .TXT ou .CSV, este parâmetro é obtido a partir do campo Nome/Código na janela Configurações do Produto | Geral.

Parâmetro: Description

Obrigatório

Sim

Descrição

A descrição do produto.

Valor

Quando o catálogo é exportado para um arquivo .TXT ou .CSV, este parâmetro é obtido a partir do campo Descrição na janela Configurações do Produto | Geral.

Parâmetro: Price

Obrigatório

Sim

Descrição

O preço do produto.

Valor

Quando o catálogo é exportado para um arquivo .TXT ou .CSV, este parâmetro é obtido a partir do campo Preço na janela Configurações do Produto | Geral.

Parâmetro: Enable VAT

Obrigatório

Não

Descrição

Indica um valor específico de imposto para este produto.

Valor

Quando o catálogo é exportado para um arquivo .TXT ou .CSV, este parâmetro é obtido a partir da opção ICMS (%) na janela Configurações do Produto | Geral. Esta opção só fica disponível se o Tipo "ICMS incluído" tiver sido selecionado em Configurações do ICMS em Carrinho de compras | Disponibilidade. É usado associado a um valor específico de ICMS para um produto, que seja diferente do valor do imposto para os outros produtos no catálogo. Nestes casos os preços são fornecidos sem o ICMS.

Este parâmetro pode ter um valor de 0, se a opção ICMS (%) não tiver sido selecionada, ou 1 se tiver sido.

Parâmetro: VAT Value

Obrigatório

Não

Descrição

A taxa a ser aplicada ao preço de um produto com um imposto específico

Valor

Quando o catálogo é exportado em um arquivo .TXT ou .CSV, este parâmetro é obtido a partir da opção ICMS (%) na janela Configurações do Produto | Geral que só fica disponível se, na Carrinho de compras | Disponibilidade o Tipo "ICMS incluído" tiver sido selecionada para as Configurações do ICMS.

Se a opção ICMS (%) na janela Configurações do Produto | Geral estiver selecionada mas nenhum valor for fornecido, o Valor padrão (%) indicado em Configurações do Produto | Disponibilidade é que será usado.

Parâmetro: Weight

Obrigatório

Não

Descrição

O peso do produto.

Valor

Quando o catálogo é exportado para um arquivo .TXT ou .CSV, este parâmetro é obtido a partir do campo Peso na janela Configurações do Produto | Geral.

Parâmetro: Options

Obrigatório

Não

Descrição

Uma lista de variações possíveis do produto.

Valor

Quando o catálogo é exportado para um arquivo .TXT ou .CSV, este parâmetro é obtido a partir do campo Lista de Opções Principais na janela Configurações do Produto | Opções.

Se você estiver criando um arquivo .TXT ou .CSV para importar, as variações do produto na lista podem ser separados pelo caractere "|", desta forma:

... ; Variação1 |Variação2 | Variação3 ; ....

Todas as variações necessárias podem ser adicionadas desta forma.

Parâmetro: Enable Discounts

Obrigatório

Não

Descrição

Indicador de desconto para quantidades.

Valor

Quando o catálogo é exportado para um arquivo .TXT ou .CSV, este parâmetro é obtido a partir do campo Habilitar desconto por quantidade na janela Configurações do Produto | Desconto.

Este parâmetro pode ter um valor de 1 ou 0, dependendo se a opção Habilitar desconto por quantidade tiver sido selecionada ou não.

Parâmetro: Discounts

Obrigatório

Não

Descrição

A lista de descontos possíveis para compra em quantidade.

Valor

Quando o catálogo é exportado para um arquivo .TXT ou .CSV, este parâmetro é obtido a partir do campo Habilitar desconto por quantidade na janela Configurações do Produto | Desconto.

Se você estiver criando um arquivo .TXT ou .CSV para importar, a lista dos descontos para compras em quantidade deverão ser inseridas da seguinte forma:

... ; quantidade : desconto | quantidade : disconto ; ...

Portanto, se um desconto de 10% for aplicado a compras de mais de 20 artigos, e um desconto de 15% for aplicado a compras de mais de 50 artiogs, você deverá inserir assim:

... ; 20 : 10 | 50 : 15 ; ...

Use o caractere "|" para adicionar todos os descontos por quantidade necessários.

Quando importar um arquivo .TXT ou .CSV gerado por uma operação de exportação anterior ou que você mesmo tenha escrito, ele provavelmente será atualizado pelo Programa, para adicionar as IDs que faltarem, por exemplo. Se quiser uma cópia atualizada do arquivo .TXT ou .CSV, você terá que re-exportar o catálogo de produtos.

Melhores práticas:

-

Como definir o conteúdo de um email de confirmação do pedido de compra


Navegadores web & o navegador do WebSite X5

Maiores informações >

Navegadores web & o navegador do WebSite X5

 Return to chapter overview
Exibir/Ocultar o texto oculto

Um Navegador é um programa que permite aos usuários exibir e interagir com as informações (texto, imagens, etc) em uma página web. Os navegadores mais frequentemente utilizados são Microsoft Explorer®, Firefox®, Safari® e Google Chrome™.

Os navegadores usam um mecanismo de renderização para exibir o conteúdo de uma página. Um mecanismo de renderização é um programa que baixa o conteúdo (uma página HTML, por exemplo) e formata a informação nela (CSSs associados, por exemplo) e exibe tudo na tela. Os navegadores usam diferentes mecanismos de renderização, e eles diferem na qualidade de renderização, em relação a padrões, e velocidade. Portanto, as páginas podem parecer diferentes dependendo do navegador em que forem exibidas. Entretanto, como uma página web não é impressa, uma certa margem de diferença é aceitável, se a experiência que o usuário tiver ao visitar não for prejudicada por isto.

A melhor maneira de obter páginas web que sejam compatíveis com os principais navegadores, nas suas diversas versões, é criar um código limpo que adere às normas aceitas.

O WebSite X5 gera automaticamente o código HTML5 associado ao CSS 2.1 ou 3, e garante uma total compatibilidade com todos os navegadores principais e dispositivos móveis, tais como celulares, tablets e smartphones.

Clique para expandir/recolher O navegador interno do WebSite X5

Quando estiver trabalhando em um projeto, você precisará poder conferir o resultado final e como o site será exibido quando tiver sido publicado. Para isso, o WebSite X5 fornece um botão Pré-visualizar, que fica sempre disponível (veja O ambiente de trabalho), que oferece uma prévia do website no seu computador. Ela é constantemente atualizada (veja Manter a Pré-visualização atualizada ao trabalhar no projeto na janela Preferências).

Para exibir a pré-visualização, o WebSite X5 usa seu próprio navegador, baseado no Chromium (http://www.chromium.org/), o navegador de código aberto que emprestou seu nome ao Google Chrome™. Este navegador tem os seguintes comandos:

Voltar

Para voltar para a última página visitada.

Avançar

Avançar para a página visitada anteriormente, da qual retornou.

Home page (Página inical)

Ir para a página inicial do site.

Barra de endereço

Exibe o caminho da página em exibição e/ou permite que você inisira o endereço da página que deseja exibir.

Ir

Carrega a página indicada na barra de endereço. Você também pode carregar a página pressionando a tecla ENTER.

Editar página

Faz retornar ao Programa, abrindo a página exibida como uma pré-visualização no navegador na janela Criação da página, de modo que possa ser editada. Se a página for parte do Blog, da Área Restrita ou do Carrinho de compras, este botão o levará de volta à seção relativa no Passo 4 - Configurações Avançadas.

Quando a janela do navegador se abre para exibir a pré-visualização da página em que está trabalhando, a página em exibição muda automaticamente de acordo com a página a ser exibida na janela no navegador.

Usar um navegador próprio para exibir uma pré-visualização do site em construção tem as seguintes vantagens:

§a pré-visualização não substitui a página do website em exibição na janela do seu navegador normal;

§a pré-visualização do site em construção é atualizada na janela do navegador interno e não é preciso abrir novas janelas no seu navegador padrão.


O Mecanismo de Busca interno do WebSite X5 funciona

Como o mecanismo de busca interno do WebSite X5 funciona

Maiores informações >

Como o mecanismo de busca interno do WebSite X5 funciona

 Return to chapter overview
Exibir/Ocultar o texto oculto

O WebSite X5 lhe oferece a possibilidade de adicionar um campo de busca ao Cabeçalho / Rodapé do modelo (veja Personalização do modelo | Inserir campo de busca), de modo que os visitantes do seu site possam usar este mecanismo para procurar por coisas específicas no seu website. O Mecanismo irá buscar entre as páginas, imagens, vídeos, produtos no carrinho de compras e no Blog: os resultados da busca são organizados por relevância e exibidos em páginas criadas automaticamente pelo Programa.

Clique para expandir/recolher No que o Mecanismo de Busca baseia sua pesquisa?

Para obter o máximo do Mecanismo de Busca interno do WebSite X5, você precisa saber que:

§Páginas

Os itens que o Mecanismo de Busca leva em consideração em uma página são o título, descrição e palavras-chave (veja a janela Propriedades da Página |Geral), além do conteúdo de texto.

§Imagens / Vídeos

O Mecanismo de Busca só leva em consideração imagens e vídeos que tenham sido adicionados ao SiteMap (veja Objeto Imagem | Sitemap ou Objeto Vídeo/Som | Sitemap) e ele analisa todas as informações que tiverem sido fornecidas: Título, Legenda e Localização geográfica (p.ex. Endereço, Cidade, etc) para as imagens; Título, Legenda, Categoria, Palavras-chave e Data de publicação para os vídeos.

§Produtos no carrinho de compras da loja virtual

O Mecanismo de Busca extende sua pesquisa para incluir todos os produtos que tiverem sido incluídos no catálogo do carrinho de compras da loja virtual, analisando o Nome/Código e a Descrição vinculada (veja Configurações do Produto | Geral).

§Blog

Todas as páginas do seu Blog são incluídas nas pesquisas. O Mecanismo de Busca analisa a Título, o Autor, a Categoria, o Marcador, a Legenda e o Conteúdo de cada Postagem.

§Área Restrita

As páginas com acesso por login e senha (dentro da Área Restrita) não são consideradas pelo Mecanismo de Busca, a menos que o usuário já esteja logado.

§Páginas ocultas

Páginas que estejam Ocultas no menu de navegação são tratadas como páginas normais para efeito das pesquisas.

§Para excluir uma página das buscas

Se quiser excluir uma página das buscas, selecione-a no Mapa, abra a janela Propriedades da Página e, na aba Avançadas, desmarque a opção Inserir esta página no SiteMap.

§Maiúsculas/Minúsculas

O Mecanismo de Busca não diferencia letras maiúsculas das minúsculas; ele não vê diferença entre os dois tipos de letras.

Os diversos parâmetros que o Mecanismo de Busca leva em consideração têm pesos diferentes: por exemplo, a ocorrência de elementos nos títulos das páginas é considerado muito relevante. Assim, as ocorrências de alguns parâmetros são automaticamente multiplicados por um fator de correção antes de serem associadas a outras ocorrências. Dependendo do número de ocorrências, a relevância de um elemento é calculada e é posicionada de acordo com este cálculo na página que mostra os resultados da busca.
Clique para expandir/recolher As páginas de Resultado de Buscas

As páginas de Resultado de Buscas são criadas automaticamente pelo Programa e exibem:

§o campo de busca, que você vê no cabeçalho ou rodapé do modelo;

§um menu lateral, onde você pode escolher se deseja exibir os resultados por páginas, Blog, carrinho de compras, imagens ou vídeos. Ao lado de cada item neste menu fica o número de resultados encontrados para ele nas buscas, entre parenteses. Se não houver resultados para uma determinada categoria, ela não será incluída no menu;

§a lista dos resultados da busca, ordenados de acordo com a relevância que foi calculada.

Lembre-se que, nas páginas que exibem os resultados das buscas de imagens e vídeos, você pode clicar diretamente na imagem ou vídeo na lista para abrir a página onde está inserida.

O Mecanismo de Busca interno é particularmente útil para websites que tenham um catálogo de produtos bem extenso: as páginas com Resultado das Buscas não somente dão uma completa descrição dos produtos, mas também inlcuem o botão "Comprar" para que os visitantes possam fazer a compra online imediatamente.

As páginas de Resultado de Buscas são criadas automaticamente pelo Programa: o estilo destas páginas é definido no Passo 4 - Configurações Avançadas, na seção Estilos e Modelos e o menu lateral pode ser definido na seção Estilo do Menu de Página.


O Box Model no WebSite X5

Maiores informações >

O Box Model no WebSite X5

 Return to chapter overview

No WebSite X5 as páginas são criadas com a ajuda de uma tabela de layout de página e você pode aperfeiçoar o design e o layout da página ajustando as margens nas opções Margem externa e Margem interna na aba Estilo da célula | Estilo.

Para entender completamente o que se quer dizer por Margem, e então dispor corretamente os elementos e conteúdo da página, é preciso ter certeza de qual Box Model está sendo usado.

Quando se escreve um código de página web, todos os elementos HTML são consideradas caixas e os parâmetros que definem o aspecto visual de cada caixa é chamado Box Model. Cada "caixa" consiste de um número básico de componentes - margens, bordas, margem interna e o conteúdo de fato - e cada um pode ser modificado com as propriedades CSS.

O diagrama abaixo ilutstra os diversos componentes de um Box Model:

No WebSite X5 a tabela de layout de página padrão tem um número de células às quais os conteúdos da página podem ser adicionados. Cada célula tem o Box Model exibido.

Os elementos são:

§Conteúdo (em verde): o conteúdo é adicionado à célula arrastando um dos objetos disponíveis para dentro dela.

§Margem interna (em rosa): é o espaço entre o conteúdo e as bordas.

§Borda: a borda contorna a margem interna e o conteúdo. Você pode definir a aparência das bordas na janela Estilo da célula.

§Margem (em amarelo): é o espaço entre a borda e as linhas da tabela de layout de página.

Dadas estas definições, o espaço entre dois objetos adjacentes (horizontal ou verticalmente) é igual às margens definidas para as células nas quais os objetos tenham sido colocados.


O Painel de Controle online

Maiores informações >

O Painel de Controle online

 Return to chapter overview

O WebSite X5 automaticamente configura um Painel de Controle online para cada website criado com o Programa. É usado pelos administradores do site para gerenciar comentários nas postagens do Blog ou mensagens adicionadas ao Livro de Visitas, e para obter informações de diagnósitco sobre o website.

Os usuários no grupo Administradores, criado na seção Gerenciar acesso do Passo 4 - Configurações Avançadas podem acessá-lo.

Para acessar o Painel de Controle:

§Acesse a URL http://www.meusite.com.br/admin, onde http://www.meusite.com.br é a URL do site.

§Insira seus dados de login e senha.

Quando tiver entrado, você verá estas abas no Painel de Controle:

§Blog: para gerenciar comentários feitos por visitantes nas postagens do Blog vinculado ao website (veja Como gerenciar os comentários no Blog e no Livro de Visitas a partir do Painel de Controle Online)

§Guestbook: para gerenciar as mensagens deixadas por visitantes no Livro de Visitas que você pode adicionar usando o Objeto Livro de Visitas.

§WebSite Test: para exibir informações de diagnóstico sobre o website e sobre o Servidor no qual tiver sido publicado. As informações são sobre:

-Versão do PHP - o servidor deverá dar suporte à linguagem PHP para que oe emails do Objeto Formulário de Email e do Carrinho de compras funcionem corretamente, alem das páginas de login e senha para acessar as páginas Protegidas. Se houver suporte para o PHP, a versão do PHP no servidor é indicada.

-Suporte da sessão - Além de dar suporte ao PHP, o Servidor também deverá dar suporte a sessões para que somente os usuários autorizados com login e senha possam acessar as páginas Protegidas.

-Caminho da pasta pública no servidor - Para poder armazenar e gerenciar comentários nas Postagens do Blog e do Objeto Livro de Visitas, é preciso haver uma pasta no Servidor com permissão de escrita. A presença desta pasta é verificada, e então a permissão para escrita também é verificada.

-Suporte MySQL e configurações de banco de dados - Quando você cria um Objeto Formulário de Email você pode especificar que os dados enviados sejam remetidos a um banco de dados (veja Objeto Formulário de Email | Envio): você precisará fornecer alguns parâmetros para que seja feita a conexão com o banco de dados que deseja usar no Servidor. O Servidor é sondado para verificar se oferece suporte a MySQL, e então os parâmetros que você tiver especificado serão verificados para certificar que eles realmente darão acesso ao banco de dados.


Informações e Suporte

Informações e Suporte

é um produto Incomedia

www.websitex5.com

www.incomedia.eu

Copyright 2013 Incomedia. Todos os direitos reservados.

WebSite X5 usa DotNetZip, coberto por uma Licença MS-PL (Microsoft Public License)

WebSite X5 usa Cef, coberto por uma Licença LBSD 3.

WebSite X5 usa Cef Sharp, coberto por uma Licença BSD 2.

Para maiores informações e assistência técnica, visite nosso website: www.websitex5.com/help


License BSD 3

License BSD 3

Copyright (c) 2008-2012 Marshall A. Greenblatt. Portions Copyright (c)

2006-2009 Google Inc. All rights reserved.

Redistribution and use in source and binary forms, with or without

modification, are permitted provided that the following conditions are

met:

* Redistributions of source code must retain the above copyright

notice, this list of conditions and the following disclaimer.

* Redistributions in binary form must reproduce the above

copyright notice, this list of conditions and the following disclaimer

in the documentation and/or other materials provided with the

distribution.

* Neither the name of Google Inc. nor the name Chromium Embedded

Framework nor the names of its contributors may be used to endorse

or promote products derived from this software without specific prior

written permission.

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS

"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT

LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR

A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT

OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,

SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT

LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,

DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY

THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT

(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE

OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.


License BSD 2

License BSD 2

Copyright (c) 2012, Anthony Taranto.

Redistribution and use in source and binary forms, with or without

modification, are permitted provided that the following conditions are

met:

* Redistributions of source code must retain the above copyright

notice, this list of conditions and the following disclaimer.

* Redistributions in binary form must reproduce the above

copyright notice, this list of conditions and the following disclaimer

in the documentation and/or other materials provided with the

distribution.

* Neither the name of Google Inc. nor the name Chromium Embedded

Framework nor the name CefSharp nor the names of its contributors

may be used to endorse or promote products derived from this software

without specific prior written permission.

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS

"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT

LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR

A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT

OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,

SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT

LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,

DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY

THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT

(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE

OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.


Microsoft Public License (Ms-PL)

Microsoft Public License (Ms-PL)

 Return to chapter overview

This license governs use of the accompanying software. If you use the software, you accept this license. If you do not accept the license, do not use the software.

1. Definitions

The terms "reproduce," "reproduction," "derivative works," and "distribution" have the same meaning here as under U.S. copyright law.

A "contribution" is the original software, or any additions or changes to the software.

A "contributor" is any person that distributes its contribution under this license.

"Licensed patents" are a contributor's patent claims that read directly on its contribution.

2. Grant of Rights

(A) Copyright Grant- Subject to the terms of this license, including the license conditions and limitations in section 3, each contributor grants you a non-exclusive, worldwide, royalty-free copyright license to reproduce its contribution, prepare derivative works of its contribution, and distribute its contribution or any derivative works that you create.

(B) Patent Grant- Subject to the terms of this license, including the license conditions and limitations in section 3, each contributor grants you a non-exclusive, worldwide, royalty-free license under its licensed patents to make, have made, use, sell, offer for sale, import, and/or otherwise dispose of its contribution in the software or derivative works of the contribution in the software.

3. Conditions and Limitations

(A) No Trademark License- This license does not grant you rights to use any contributors' name, logo, or trademarks.

(B) If you bring a patent claim against any contributor over patents that you claim are infringed by the software, your patent license from such contributor to the software ends automatically.

(C) If you distribute any portion of the software, you must retain all copyright, patent, trademark, and attribution notices that are present in the software.

(D) If you distribute any portion of the software in source code form, you may do so only under this license by including a complete copy of this license with your distribution. If you distribute any portion of the software in compiled or object code form, you may only do so under a license that complies with this license.

(E) The software is licensed "as-is." You bear the risk of using it. The contributors give no express warranties, guarantees or conditions. You may have additional consumer rights under your local laws which this license cannot change. To the extent permitted under your local laws, the contributors exclude the implied warranties of merchantability, fitness for a particular purpose and non-infringement.


print_copyright

print_copyright

© Copyright 2013 Incomedia. All rights reserved.

Le informazioni contenute in questo manuale possono essere soggette a modifiche senza alcun preavviso. Nessuna parte di questo manuale può essere riprodotta o trasmessa in qualsiasi forma o con qualsiasi mezzo, elettronico o meccanico, per qualsiasi scopo, senza l'espresso consenso scritto di Incomedia.

Si ricorda che filmati, suoni o immagini che si desidera utilizzare nei progetti possono essere soggetti a diritto d'autore. L'inserimento non autorizzato di tali materiali potrebbe, dunque, rappresentare una violazione dei diritti di autore ed è bene accertarsi di poterne fare uso liberamente o ottenere i permessi necessari dai rispettivi autori o dagli enti preposti.

Incomedia, WebSite X5, WebSite X5 Evolution sono marchi registrati di Incomedia s.r.l. Altri marchi o nomi di prodotti citati nel presente documento sono marchi o marchi registrati dei rispettivi proprietari.

Scritto e impaginato da Incomedia s.r.l.